└── E - Commerce
├── Technical Documentation page.html
├── about.html
├── cart.html
├── contact.html
├── images
├── abishek.jpg
├── balaji.jpg
├── bharath.jpg
├── buy-1.jpg
├── buy-2.jpg
├── buy-3.jpg
├── cart.png
├── category-1.jpg
├── category-2.jpg
├── category-3.jpg
├── clg1.jpg
├── clg2.png
├── exclusive.png
├── gallery-1.jpg
├── gallery-2.jpg
├── gallery-3.jpg
├── gallery-4.jpg
├── gowsik.jpg
├── guide.jpg
├── image1.png
├── logo.png
├── no name image1.jpg
├── no name logo (2).png
├── product-1.jpg
├── product-10.jpg
├── product-11.jpg
├── product-12.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
└── qr.jpg
├── index.html
├── indexstyle.css
├── login or signup.html
├── loginstyle.css
├── offer.html
├── payment.html
├── product-details Casual Shoe (Black).html
├── product-details Casual Shoe(GREY).html
├── product-details Casual Shoe.html
├── product-details Pant(BLACK).html
├── product-details Pant(BROWN).html
├── product-details Shoe(BLACK).html
├── product-details Socks (Set of Three).html
├── product-details T-Shirt (RED).html
├── product-details T-Shirt(BLACK).html
├── product-details T-Shirt(BLUE).html
├── product-details Watch (Grey).html
├── product-details Watch(BLACK).html
├── product-details Watch(RED).html
├── product.html
├── res.html
└── style1.css
/E - Commerce/Technical Documentation page.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
5 |
6 |
10 |
11 |
12 |
13 |
14 |
15 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
Abishek T
30 |
Developer
31 |
abisheksa20@gmail.com
32 |
33 |
34 |
35 |
Balaji S
36 |
Developer
37 |
balajisunder17@gmail.com
38 |
39 |
40 |
41 |
Bharath A S
42 |
Tester
43 |
bharathbharath313@gmail.com
44 |
45 |
46 |
47 |
Gowsik T
48 |
Tester
49 |
gowsik010@gmail.com
50 |
51 |
52 |
53 |
54 |
55 |
Ms.Vinotha R
56 |
Guide
57 |
vinothar.it@mkce.ac.in
58 |
59 |
60 |
61 |
71 |
72 |
--------------------------------------------------------------------------------
/E - Commerce/images/abishek.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/abishek.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/balaji.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/balaji.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/bharath.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/bharath.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/buy-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/buy-1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/buy-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/buy-2.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/buy-3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/buy-3.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/cart.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/cart.png
--------------------------------------------------------------------------------
/E - Commerce/images/category-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/category-1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/category-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/category-2.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/category-3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/category-3.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/clg1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/clg1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/clg2.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/clg2.png
--------------------------------------------------------------------------------
/E - Commerce/images/exclusive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/exclusive.png
--------------------------------------------------------------------------------
/E - Commerce/images/gallery-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/gallery-1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/gallery-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/gallery-2.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/gallery-3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/gallery-3.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/gallery-4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/gallery-4.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/gowsik.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/gowsik.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/guide.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/guide.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/image1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/image1.png
--------------------------------------------------------------------------------
/E - Commerce/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/logo.png
--------------------------------------------------------------------------------
/E - Commerce/images/no name image1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/no name image1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/no name logo (2).png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/no name logo (2).png
--------------------------------------------------------------------------------
/E - Commerce/images/product-1.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-1.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-10.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-10.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-11.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-11.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-12.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-12.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-2.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-2.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-3.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-3.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-4.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-4.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-5.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-5.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-6.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-6.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-7.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-7.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-8.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-8.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/product-9.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/product-9.jpg
--------------------------------------------------------------------------------
/E - Commerce/images/qr.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/Balaji-07/E-Commerce-Web-Development/62d3c21f8b2bba26bb93825b76ebab2f71c5f030/E - Commerce/images/qr.jpg
--------------------------------------------------------------------------------
/E - Commerce/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
E-Commerce
6 |
8 |
9 |
10 |
39 |
40 |
41 |
--------------------------------------------------------------------------------
/E - Commerce/indexstyle.css:
--------------------------------------------------------------------------------
1 | *{
2 | margin: 0;
3 | padding: 0;
4 | box-sizing: border-box;
5 | }
6 | .navbar{
7 | display: flex;
8 | align-items: center;
9 | padding: 20px;
10 | }
11 | nav{
12 | flex: 1;
13 | text-align: right;
14 | }
15 | nav ul{
16 | display: inline-block;
17 | list-style-type: none;
18 | }
19 | nav ul li{
20 | display: inline-block;
21 | margin-right: 20px;
22 | }
23 | a{
24 | text-decoration: none;
25 | color: #555;
26 | }
27 | p{
28 | color: #555;
29 | }
30 | .container{
31 | max-width: 1300px;
32 | margin: auto;
33 | padding-left: 25px;
34 | padding-right: 25px;
35 | }
36 | .row{
37 | display: flex;
38 | align-items: center;
39 | flex-wrap: wrap;
40 | justify-content: space-around;
41 | }
42 | .col-2{
43 | flex-basis: 50%;
44 | min-width: 300px;
45 | }
46 | .col-2 img{
47 | max-width: 92%;
48 | padding: 50px 0;
49 | }
50 | .col-2 h1{
51 | font-size: 50px;
52 | line-height: 60px;
53 | margin: 25px 0 ;
54 | }
55 | .btn{
56 | display: inline-block;
57 | background: #571ae4;
58 | color: #fff;
59 | padding: 8px 30px;
60 | margin: 30px 0;
61 | border-radius: 30px;
62 | }
63 | .header{
64 | background: radial-gradient(#fff,#9ea5e9);
65 | }
66 | .categories{
67 | margin: 70px 0;
68 | }
69 | .col-3{
70 | flex-basis: 30%;
71 | min-width: 250px;
72 | margin-bottom: 30px;
73 | }
74 | .col-3 img{
75 | width: 100%;
76 | }
77 | .small-container{
78 | max-width: 1080px;
79 | margin: auto;
80 | padding-left: 25px;
81 | padding-right: 25px;
82 | }
83 | .col-4{
84 | flex-basis: 25%;
85 | padding: 10px;
86 | min-width: 200px;
87 | margin-bottom: 50px;
88 | }
89 | .col-4 img{
90 | width: 100%;
91 | }
92 | .home-header{
93 | background: radial-gradient(#fff,#9ea5e9);
94 | }
95 | .home-navbar{
96 | background: radial-gradient(#fff,#9ea5e9);
97 | }
98 | /*------------------- about ------------------------*/
99 | .about{
100 | background: radial-gradient(#fff,#9ea5e9);
101 | }
102 | .about p{
103 | margin-top: 40px;
104 | margin-left: 150px;
105 | margin-right: 150px;
106 | font-size: 20px;
107 | }
108 | .about h1{
109 | margin-left: 60px;
110 | }
111 | .about h3{
112 | margin-top: 40px;
113 | margin-left: 150px;
114 | margin-right: 150px;
115 | }
116 | /*------------------- offer ------------------------*/
117 | .background{
118 | background: radial-gradient(#fff,#9ea5e9);
119 | }
120 | .offer{
121 | margin-top: 0px;
122 | padding: 90px 0;
123 | }
124 | .col-2 .offer-img{
125 | padding: 50px;
126 | }
127 | .categories h3{
128 | margin-left: 50%;
129 | }
130 | /*-------------------- clg ----------------------*/
131 | .clg{
132 | margin: 100px auto;
133 | }
134 | .col-2{
135 | width: 100px;
136 | }
137 | /*-------------------- footer ----------------------*/
138 | .footer{
139 | background: rgb(0, 0, 0);
140 | color: #8a8a8a;
141 | font-size: 14px;
142 | padding: 20px 20px;
143 | }
144 | .footer h1{
145 | color: #fff;
146 | }
147 | .footer h3{
148 | color: #fff;
149 | }
150 | .footer h4{
151 | color: #fff;
152 | }
153 | .other-footer{
154 | background: rgb(0, 0, 0);
155 | color: #8a8a8a;
156 | font-size: 14px;
157 | padding: 20px 20px;
158 | }
159 | .other-footer h3{
160 | color: #fff;
161 | }
162 | /*------------------- all products -------------*/
163 | .row-2{
164 | justify-content: space-between;
165 | margin: 100px auto 50px;
166 | }
167 | select{
168 | border: 1px solid #000;
169 | padding: 5px;
170 | }
171 | .page-btn{
172 | margin: 0 auto 80px;
173 | }
174 | .page-btn span{
175 | display: inline-block;
176 | border: 1px solid #000;
177 | margin-left: 10px;
178 | width: 40px;
179 | height: 40px;
180 | text-align: center;
181 | line-height: 40px;
182 | cursor: pointer;
183 | }
184 | /*------------------- product detail -------------*/
185 | .single-product{
186 | margin-top: 80px;
187 | }
188 | .single-product .col-2 img{
189 | padding: 0;
190 | }
191 | .single-product .col-2{
192 | padding: 20px;
193 | }
194 | .single-product h4{
195 | margin: 20px 0;
196 | font-size: 22px;
197 | }
198 | .single-product select{
199 | display: block;
200 | padding: 10px;
201 | margin-top: 20px;
202 | }
203 | .single-product input{
204 | width: 50px;
205 | height: 40px;
206 | padding-left: 10px;
207 | font-size: 20px;
208 | margin-right: 10px;
209 | border: 1px solid #000;
210 | }
211 | .small-img-row{
212 | display: flex;
213 | justify-content: space-between;
214 | }
215 | .small-img-col{
216 | flex-basis: 24%;
217 | cursor: pointer;
218 | }
219 | /*------------------- cart -------------*/
220 | .cart-page{
221 | margin: 80px auto;
222 | border-collapse: collapse;
223 | }
224 | .cart-info{
225 | display: flex;
226 | flex-wrap: wrap;
227 | }
228 | th{
229 | text-align: left;
230 | padding: 5px;
231 | color: #fff;
232 | background: #ff523b;
233 | font-weight: normal;
234 | }
235 | td{
236 | padding: 10px 5px;
237 | width: 50%;
238 | }
239 | td input{
240 | width: 40px;
241 | height: 30px;
242 | padding: 5px;
243 | }
244 | td a{
245 | color: #ff523b;
246 | font-size: 12px;
247 | }
248 | td img{
249 | width: 80px;
250 | height: 80px;
251 | margin-right: 10px;
252 | }
253 | .total-price{
254 | display: flex;
255 | justify-content: flex-end;
256 | }
257 | .total-price table{
258 | border-top: 3px solid #ff523b;
259 | width: 100%;
260 | max-width: 350px;
261 | }
262 | /*------------------- payment -------------*/
263 | .imgalign{
264 | display: block;
265 | margin-left: auto;
266 | margin-right: auto;
267 | width: 400px;
268 | }
269 | .qrmsg{
270 | display: block;
271 | margin-left: 450px;
272 | margin-right: auto;
273 | width: 400px;
274 | }
275 | /*------------------- account -------------*/
276 | /*-----------------------------------------------
277 | .account-page{
278 | padding: 50px 0;
279 | background: radial-gradient(#fff,#9ea5e9);
280 | }
281 | .form-container{
282 | background: #fff;
283 | width: 300px;
284 | height: 400px;
285 | position: relative;
286 | text-align: center;
287 | padding: 20px 0;
288 | margin: auto;
289 | box-shadow: 0 0 20px 0px rgba(0,0,0,0.1);
290 | }
291 | .form-container span{
292 | font-weight: bold;
293 | padding: 0 10px;
294 | color: #555;
295 | cursor: pointer;
296 | width: 100px;
297 | display: inline-block;
298 | }
299 | .form-btn{
300 | display: inline-block;
301 | }
302 | .form-container form{
303 | max-width: 300px;
304 | padding: 0 20px;
305 | position: absolute;
306 | top: 130px;
307 | }
308 | for, input{
309 | width: 100%;
310 | height: 30px;
311 | margin: 10px 0;
312 | padding: 0 10px;
313 | border: 1px solid #ccc;
314 | }
315 | form .btn{
316 | width: 100%;
317 | border: none;
318 | cursor: pointer;
319 | margin: 10px 0;
320 | }
321 | form .btn:focus{
322 | outline: none;
323 | }
324 | #Loginform{
325 | left: -300px;
326 | }
327 | #Regform{
328 | left: 0;
329 | }
330 | form a{
331 | font-size: 12px;
332 | }
333 | #Indicator{
334 | width: 100px;
335 | border: none;
336 | background: #ff523b;
337 | height: 3px;
338 | margin-top: 8px;
339 | transform: translateX(100px);
340 | }
341 | --------------------------------------*/
--------------------------------------------------------------------------------
/E - Commerce/login or signup.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Login or Signup
6 |
7 |
8 |
9 |
10 |
11 |
E-Commerce Web Designing
12 |
13 |
14 |
Login
15 |
Signup
16 |
17 |
63 |
64 |
65 |
79 |
80 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/loginstyle.css:
--------------------------------------------------------------------------------
1 | @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
2 | *{
3 | margin: 0;
4 | padding: 0;
5 | box-sizing: border-box;
6 | font-family: 'Poppins', sans-serif;
7 | }
8 | html,body{
9 | display: grid;
10 | height: 100%;
11 | width: 100%;
12 | place-items: center;
13 | background: -webkit-linear-gradient(left, #a445b2, #fa4299);
14 | }
15 | ::selection{
16 | background: #fa4299;
17 | color: #fff;
18 | }
19 | .wrapper{
20 | overflow: hidden;
21 | max-width: 390px;
22 | background: #fff;
23 | padding: 30px;
24 | border-radius: 5px;
25 | box-shadow: 0px 15px 20px rgba(0,0,0,0.1);
26 | }
27 | .wrapper .title-text{
28 | display: flex;
29 | width: 200%;
30 | }
31 | .wrapper .title{
32 | width: 50%;
33 | font-size: 35px;
34 | font-weight: 600;
35 | text-align: center;
36 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
37 | }
38 | .wrapper .slide-controls{
39 | position: relative;
40 | display: flex;
41 | height: 50px;
42 | width: 100%;
43 | overflow: hidden;
44 | margin: 30px 0 10px 0;
45 | justify-content: space-between;
46 | border: 1px solid lightgrey;
47 | border-radius: 5px;
48 | }
49 | .slide-controls .slide{
50 | height: 100%;
51 | width: 100%;
52 | color: #fff;
53 | font-size: 18px;
54 | font-weight: 500;
55 | text-align: center;
56 | line-height: 48px;
57 | cursor: pointer;
58 | z-index: 1;
59 | transition: all 0.6s ease;
60 | }
61 | .slide-controls label.signup{
62 | color: #000;
63 | }
64 | .slide-controls .slider-tab{
65 | position: absolute;
66 | height: 100%;
67 | width: 50%;
68 | left: 0;
69 | z-index: 0;
70 | border-radius: 5px;
71 | background: -webkit-linear-gradient(left, #a445b2, #fa4299);
72 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
73 | }
74 | input[type="radio"]{
75 | display: none;
76 | }
77 | #signup:checked ~ .slider-tab{
78 | left: 50%;
79 | }
80 | #signup:checked ~ label.signup{
81 | color: #fff;
82 | cursor: default;
83 | user-select: none;
84 | }
85 | #signup:checked ~ label.login{
86 | color: #000;
87 | }
88 | #login:checked ~ label.signup{
89 | color: #000;
90 | }
91 | #login:checked ~ label.login{
92 | cursor: default;
93 | user-select: none;
94 | }
95 | .wrapper .form-container{
96 | width: 100%;
97 | overflow: hidden;
98 | }
99 | .form-container .form-inner{
100 | display: flex;
101 | width: 200%;
102 | }
103 | .form-container .form-inner form{
104 | width: 50%;
105 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
106 | }
107 | .form-inner form .field{
108 | height: 50px;
109 | width: 100%;
110 | margin-top: 20px;
111 | }
112 | .form-inner form .field input{
113 | height: 100%;
114 | width: 100%;
115 | outline: none;
116 | padding-left: 15px;
117 | border-radius: 5px;
118 | border: 1px solid lightgrey;
119 | border-bottom-width: 2px;
120 | font-size: 17px;
121 | transition: all 0.3s ease;
122 | }
123 | .form-inner form .field input:focus{
124 | border-color: #fc83bb;
125 | /* box-shadow: inset 0 0 3px #fb6aae; */
126 | }
127 | .form-inner form .field input::placeholder{
128 | color: #999;
129 | transition: all 0.3s ease;
130 | }
131 | form .field input:focus::placeholder{
132 | color: #b3b3b3;
133 | }
134 | .form-inner form .pass-link{
135 | margin-top: 5px;
136 | }
137 | .form-inner form .signup-link{
138 | text-align: center;
139 | margin-top: 30px;
140 | }
141 | .form-inner form .pass-link a,
142 | .form-inner form .signup-link a{
143 | color: #fa4299;
144 | text-decoration: none;
145 | }
146 | .form-inner form .pass-link a:hover,
147 | .form-inner form .signup-link a:hover{
148 | text-decoration: underline;
149 | }
150 | form .btn{
151 | height: 50px;
152 | width: 100%;
153 | border-radius: 5px;
154 | position: relative;
155 | overflow: hidden;
156 | }
157 | form .btn .btn-layer{
158 | height: 100%;
159 | width: 300%;
160 | position: absolute;
161 | left: -100%;
162 | background: -webkit-linear-gradient(right, #a445b2, #fa4299, #a445b2, #fa4299);
163 | border-radius: 5px;
164 | transition: all 0.4s ease;;
165 | }
166 | form .btn:hover .btn-layer{
167 | left: 0;
168 | }
169 | form .btn input[type="submit"]{
170 | height: 100%;
171 | width: 100%;
172 | z-index: 1;
173 | position: relative;
174 | background: none;
175 | border: none;
176 | color: #fff;
177 | padding-left: 0;
178 | border-radius: 5px;
179 | font-size: 20px;
180 | font-weight: 500;
181 | cursor: pointer;
182 | }
183 | /*-------------------- logo ----------------------*/
184 | *{
185 | margin: 0;
186 | padding: 0;
187 | box-sizing: border-box;
188 | }
189 | .navbar{
190 | display: flex;
191 | align-items: center;
192 | padding: 20px;
193 | }
194 | nav{
195 | flex: 1;
196 | text-align: right;
197 | }
198 | nav ul{
199 | display: inline-block;
200 | list-style-type: none;
201 | }
202 | nav ul li{
203 | display: inline-block;
204 | margin-right: 20px;
205 | }
206 | a{
207 | text-decoration: none;
208 | color: #555;
209 | }
210 | p{
211 | color: #555;
212 | }
213 | .container{
214 | max-width: 1300px;
215 | margin: auto;
216 | padding-left: 25px;
217 | padding-right: 25px;
218 | }
219 | .row{
220 | display: flex;
221 | align-items: center;
222 | flex-wrap: wrap;
223 | justify-content: space-around;
224 | }
225 | /*-------------------- footer ----------------------*/
--------------------------------------------------------------------------------
/E - Commerce/offer.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Offer
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
This are Exclusive for certain period only....
34 |
Smart Band
35 |
You can intelligently monitor your daily activities and keep track of your current fitness and health goals by bringing home the Mi Smart Band 5. It features an approximately 2.79 cm (1.1) AMOLED display that lets you adjust the brightness levels as per your preference. It helps you accomplish your fitness goals by tracking up to 11 professional sports modes that provide precise performance data. Moreover, this smart band comes with a magnetic charger that can replenish its power in approximately two hours.
36 |
Buy Now
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
View more
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
71 |
72 |
73 |
83 |
84 |
--------------------------------------------------------------------------------
/E - Commerce/payment.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Payment
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
Scan this QR from your payment application...
34 |
35 |
36 |
37 |
44 |
45 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Casual Shoe (Black).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Casual Shoe (Black)
39 |
Casual Shoe (Black)
40 |
₹900
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
These inspired shoes salute life on the deck with a classic vulcanised look. Built for shredding around town, they deliver versatility and comfort with a rubber outsole and lightweight EVA sockliner. Leather-like 3-Stripes on the canvas upper provide a signature finish.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Casual Shoe
71 |
₹3000
72 |
73 |
74 |
75 |
T-Shirt(BLACK)
76 |
₹500
77 |
78 |
79 |
80 |
Socks (Set of Three)
81 |
₹600
82 |
83 |
84 |
85 |
Watch(BLACK)
86 |
₹5000
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Casual Shoe(GREY).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Casual Shoe(GREY)
39 |
Casual Shoe(GREY)
40 |
₹1500
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Birde Brand Offer Designer Canvas Casual Fashionable Looking Loafers & Moccasins Shoes With Different styles, sizes, and colors of Loafers shoes available for purchase, you can find the perfect pair for yourself, your child, or your significant other. These adorable shoes are as colourful as they are comfortable!
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
T-Shirt(RED)
71 |
₹450
72 |
73 |
74 |
75 |
T-Shirt(BLUE)
76 |
₹500
77 |
78 |
79 |
80 |
Shoe(BLACK)
81 |
₹1200
82 |
83 |
84 |
85 |
Pant(BROWN)
86 |
₹700
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Casual Shoe.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Casual Shoe
39 |
Casual Shoe
40 |
₹3000
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
Dual color web design superior quality mesh . Different design of upper with qtr webbing and heat transfer branding which makes shoes different and classy. SOLE :- Perfect gripping , extra cushioning, light weight and durability of shoe. Extremely light weight 3D bottom Pulse Boost side profile which adds extra cushion on the heel. Sneakers made with this bottom would be pretty comfortable.
54 |
55 |
56 |
57 |
58 |
64 |
65 |
66 |
67 |
68 |
69 |
T-Shirt(RED)
70 |
₹450
71 |
72 |
73 |
74 |
T-Shirt(BLUE)
75 |
₹500
76 |
77 |
78 |
79 |
Shoe(BLACK)
80 |
₹1200
81 |
82 |
83 |
84 |
Pant(BROWN)
85 |
₹700
86 |
87 |
88 |
89 |
90 |
91 |
98 |
99 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Pant(BLACK).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Pant(BLACK)
39 |
Pant(BLACK)
40 |
₹800
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Trendsetter brings to you this Formal trouser with a slim fit design that gives you amazing comfort in formal wear that can be worn to such places. They are meticulously stitched material and feel smooth against your skin. The side pockets allow you to comfortably place your palms inside them along with storing wallets and handkerchiefs. The mid-rise waist provides a modern look and the belt loops allow a tighter fit when a belt is slipped through the loops. The button and zip closure is easy to use. You can try on these men’s Formal trousers to match your style.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Casual Shoe
71 |
₹3000
72 |
73 |
74 |
75 |
T-Shirt(BLACK)
76 |
₹500
77 |
78 |
79 |
80 |
Socks (Set of Three)
81 |
₹600
82 |
83 |
84 |
85 |
Watch(BLACK)
86 |
₹5000
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Pant(BROWN).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Pant(BROWN)
39 |
Pant(BROWN)
40 |
₹700
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Sharpen up your appearance with the latest pair of trousers. This grey pair can be worn with canvas shoes and a fitted tee for your next date night.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Watch(GREY)
71 |
₹3000
72 |
73 |
74 |
75 |
Casual Shoe (Black)
76 |
₹900
77 |
78 |
79 |
80 |
Casual Shoe(GREY)
81 |
₹1500
82 |
83 |
84 |
85 |
Pant(BLACK)
86 |
₹800
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Shoe(BLACK).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Shoe(BLACK)
39 |
Shoe(BLACK)
40 |
₹1200
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Make your Casual look with this pair of shoes.Stay comfortable all day with the synthetic inner of these shoes. The shoes are highly durable apart from looking very stylish.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Casual Shoe
71 |
₹3000
72 |
73 |
74 |
75 |
T-Shirt(BLACK)
76 |
₹500
77 |
78 |
79 |
80 |
Socks (Set of Three)
81 |
₹600
82 |
83 |
84 |
85 |
Watch(BLACK)
86 |
₹5000
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Socks (Set of Three).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Socks (Set of Three)
39 |
Socks (Set of Three)
40 |
₹600
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
These simple, breathable and stylish men's socks are just what you need for everyday wear. The original cotton, Nylon and Elastane blend is soft against the skin and resistant to shrinking and damage. Available in classic Grey, White and Black color that goes with anything. Show off your personality with this pattern design. you'll appreciate warmth and durability of this original cotton, Nylon and Elastane blend material. Bundle up when it's cold and cool down when it's hot with this all-season design that has removable insulation. Add a comfortable finishing touch to any outfit with this warm and wearable Ankle length style.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
T-Shirt(RED)
71 |
₹450
72 |
73 |
74 |
75 |
T-Shirt(BLUE)
76 |
₹500
77 |
78 |
79 |
80 |
Shoe(BLACK)
81 |
₹1200
82 |
83 |
84 |
85 |
Pant(BROWN)
86 |
₹700
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details T-Shirt (RED).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
Home / T-Shirt
36 |
T-Shirt (RED)
37 |
₹450
38 |
Size
39 |
40 | Select
41 | S
42 | M
43 | L
44 |
45 |
46 |
Quantity
47 |
48 |
Add to Cart
49 |
Product Description
50 |
51 |
Henley neck full sleeve T-shirt direct from the manfacturers.By wearing this T-shirt it gives a stylish look and great comfort.Fill your wardrobe with beautiful and stylish collections of Henley neck full sleeve T-shirt. Trusted brand online and no compromise on quality.
52 |
53 |
54 |
55 |
56 |
62 |
63 |
64 |
65 |
66 |
67 |
Casual Shoe
68 |
₹3000
69 |
70 |
71 |
72 |
T-Shirt(BLACK)
73 |
₹500
74 |
75 |
76 |
77 |
Socks (Set of Three)
78 |
₹600
79 |
80 |
81 |
82 |
Watch(BLACK)
83 |
₹5000
84 |
85 |
86 |
87 |
88 |
89 |
96 |
97 |
--------------------------------------------------------------------------------
/E - Commerce/product-details T-Shirt(BLACK).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / T-Shirt(BLACK)
39 |
T-Shirt(BLACK)
40 |
₹500
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Feel like a billionaire as you adorn this slim-fit cotton T-shirt.This T-shirt can be teamed up with a pair of denims and sneakers to complete your stylish look.Soft texture of cotton and classic stitching makes this T-shirt best option for a brunch.Pull-up linen trousers and leather flip-flops with this comfortable T-shirt as you head out for a wild outing.
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Watch(GREY)
71 |
₹3000
72 |
73 |
74 |
75 |
Casual Shoe (Black)
76 |
₹900
77 |
78 |
79 |
80 |
Casual Shoe(GREY)
81 |
₹1500
82 |
83 |
84 |
85 |
Pant(BLACK)
86 |
₹800
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details T-Shirt(BLUE).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / T-Shirt(BLUE)
39 |
T-Shirt(BLUE)
40 |
₹500
41 |
Size
42 |
43 | Select
44 | S
45 | M
46 | L
47 |
48 |
49 |
Quantity
50 |
51 |
Add to Cart
52 |
Product Description
53 |
54 |
Soft, comfortable and breathable, vibrant and functional T-shirts from Zeffit – All Weather Gear is designed to keep you covered through all your activities! Crafted from a sweat-absorbent Pc Cotton material, each of these T-shirts feels like a second skin. The comfortable regular fit and half sleeves pile on the comfort factor while keeping you on trend. Pair these T-shirts with track pants at the gym or with jeans to hit the club in style!
55 |
56 |
57 |
58 |
59 |
65 |
66 |
67 |
68 |
69 |
70 |
Watch(GREY)
71 |
₹3000
72 |
73 |
74 |
75 |
Casual Shoe (Black)
76 |
₹900
77 |
78 |
79 |
80 |
Casual Shoe(GREY)
81 |
₹1500
82 |
83 |
84 |
85 |
Pant(BLACK)
86 |
₹800
87 |
88 |
89 |
90 |
91 |
92 |
99 |
100 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Watch (Grey).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Watch (Grey)
39 |
Watch (Grey)
40 |
₹3000
41 |
42 |
Quantity
43 |
44 |
Add to Cart
45 |
Product Description
46 |
47 |
World's one of the best Indian movement and battery helps to run the watch for years & years. Crafted from a rich quality material, this watch for men is light in weight and long lasting too. Shocknshop known for its edgy and affordable range of watches. You can show it off with your casual & formal attires to grab compliments from everyone around. Being easily Affordable to make it sit right on your wrist, it can add a physical dimension to your Style
48 |
49 |
50 |
51 |
52 |
58 |
59 |
60 |
61 |
62 |
63 |
T-Shirt(RED)
64 |
₹450
65 |
66 |
67 |
68 |
T-Shirt(BLUE)
69 |
₹500
70 |
71 |
72 |
73 |
Shoe(BLACK)
74 |
₹1200
75 |
76 |
77 |
78 |
Pant(BROWN)
79 |
₹700
80 |
81 |
82 |
83 |
84 |
85 |
92 |
93 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Watch(BLACK).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Watch(BLACK)
39 |
Watch(BLACK)
40 |
₹5000
41 |
42 |
Quantity
43 |
44 |
Add to Cart
45 |
Product Description
46 |
47 |
If you are a person who respects time and is always punctual, then this LimeStone fashion wristwatch is what you need. With looks and impressive features, this watch will be a great addition to your wardrobe, this battery-powered watch looks classy on your wrist.
48 |
49 |
50 |
51 |
52 |
58 |
59 |
60 |
61 |
62 |
63 |
Watch(GREY)
64 |
₹3000
65 |
66 |
67 |
68 |
Casual Shoe (Black)
69 |
₹900
70 |
71 |
72 |
73 |
Casual Shoe(GREY)
74 |
₹1500
75 |
76 |
77 |
78 |
Pant(BLACK)
79 |
₹800
80 |
81 |
82 |
83 |
84 |
85 |
92 |
93 |
--------------------------------------------------------------------------------
/E - Commerce/product-details Watch(RED).html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products Detail
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
Home / Watch(RED)
39 |
Watch(RED)
40 |
₹800
41 |
42 |
Quantity
43 |
44 |
Add to Cart
45 |
Product Description
46 |
47 |
The Mi Smart Band features a 39.9% larger and AMOLED color full-touch display with adjustable brightness, so everything is clear as can be....
48 |
49 |
50 |
51 |
52 |
58 |
59 |
60 |
61 |
62 |
63 |
T-Shirt(RED)
64 |
₹450
65 |
66 |
67 |
68 |
T-Shirt(BLACK)
69 |
₹500
70 |
71 |
72 |
73 |
Shoe
74 |
₹800
75 |
76 |
77 |
78 |
Pant
79 |
₹500
80 |
81 |
82 |
83 |
84 |
85 |
92 |
93 |
--------------------------------------------------------------------------------
/E - Commerce/product.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
Products
6 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
Products
32 |
33 | Default
34 | Sort by Price
35 | Sort by Popularity
36 | Sort by Rating
37 | Sort by Sale
38 |
39 |
40 |
41 |
42 |
43 |
T-Shirt(RED)
44 |
₹450
45 |
46 |
47 |
48 |
T-Shirt(BLUE)
49 |
₹500
50 |
51 |
52 |
53 |
Shoe(BLACK)
54 |
₹1200
55 |
56 |
57 |
58 |
Pant(BROWN)
59 |
₹700
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 |
Casual Shoe
71 |
₹3000
72 |
73 |
74 |
75 |
T-Shirt(BLACK)
76 |
₹500
77 |
78 |
79 |
80 |
Socks (Set of Three)
81 |
₹600
82 |
83 |
84 |
85 |
Watch(BLACK)
86 |
₹5000
87 |
88 |
89 |
90 |
91 |
92 |
Watch(GREY)
93 |
₹3000
94 |
95 |
96 |
97 |
Casual Shoe (Black)
98 |
₹900
99 |
100 |
101 |
102 |
Casual Shoe(GREY)
103 |
₹1500
104 |
105 |
106 |
107 |
Pant(BLACK)
108 |
₹800
109 |
110 |
111 |
112 |
1
113 |
2
114 |
3
115 |
4
116 |
117 |
118 |
119 |
126 |
127 |
--------------------------------------------------------------------------------
/E - Commerce/res.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
Response
5 |
You response have been recorded........
6 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
--------------------------------------------------------------------------------
/E - Commerce/style1.css:
--------------------------------------------------------------------------------
1 | @import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');
2 | *{
3 | margin: 0;
4 | padding: 0;
5 | box-sizing: border-box;
6 | font-family: 'Poppins', sans-serif;
7 | }
8 | html,body{
9 | display: grid;
10 | height: 100%;
11 | width: 100%;
12 | place-items: center;
13 | background: -webkit-linear-gradient(left, #cc00ff, #f33a3a);
14 | }
15 | .field label{
16 | visibility: hidden;
17 | }
18 | ::selection{
19 | background: #fa4299;
20 | color: #fff;
21 | }
22 | .wrapper{
23 | overflow: hidden;
24 | max-width: 390px;
25 | background: #fff;
26 | padding: 30px;
27 | border-radius: 5px;
28 | box-shadow: 0px 15px 20px rgba(0,0,0,0.1);
29 | }
30 | .wrapper .title-text{
31 | display: flex;
32 | width: 200%;
33 | }
34 | .wrapper .title{
35 | width: 50%;
36 | font-size: 35px;
37 | font-weight: 600;
38 | text-align: center;
39 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
40 | }
41 | .wrapper .slide-controls{
42 | position: relative;
43 | display: flex;
44 | height: 50px;
45 | width: 100%;
46 | overflow: hidden;
47 | margin: 30px 0 10px 0;
48 | justify-content: space-between;
49 | border: 1px solid lightgrey;
50 | border-radius: 5px;
51 | }
52 | .slide-controls .slide{
53 | height: 100%;
54 | width: 100%;
55 | color: #fff;
56 | font-size: 18px;
57 | font-weight: 500;
58 | text-align: center;
59 | line-height: 48px;
60 | cursor: pointer;
61 | z-index: 1;
62 | transition: all 0.6s ease;
63 | }
64 | .slide-controls label.signup{
65 | color: #000;
66 | }
67 | .slide-controls .slider-tab{
68 | position: absolute;
69 | height: 100%;
70 | width: 50%;
71 | left: 0;
72 | z-index: 0;
73 | border-radius: 5px;
74 | background: -webkit-linear-gradient(left, #a445b2, #fa4299);
75 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
76 | }
77 | input[type="radio"]{
78 | display: none;
79 | }
80 | #signup:checked ~ .slider-tab{
81 | left: 50%;
82 | }
83 | #signup:checked ~ label.signup{
84 | color: #fff;
85 | cursor: default;
86 | user-select: none;
87 | }
88 | #signup:checked ~ label.login{
89 | color: #000;
90 | }
91 | #login:checked ~ label.signup{
92 | color: #000;
93 | }
94 | #login:checked ~ label.login{
95 | cursor: default;
96 | user-select: none;
97 | }
98 | .wrapper .form-container{
99 | width: 100%;
100 | overflow: hidden;
101 | }
102 | .form-container .form-inner{
103 | display: flex;
104 | width: 200%;
105 | }
106 | .form-container .form-inner form{
107 | width: 50%;
108 | transition: all 0.6s cubic-bezier(0.68,-0.55,0.265,1.55);
109 | }
110 | .form-inner form .field{
111 | height: 50px;
112 | width: 100%;
113 | margin-top: 20px;
114 | }
115 | .form-inner form .field input{
116 | height: 100%;
117 | width: 100%;
118 | outline: none;
119 | padding-left: 15px;
120 | border-radius: 5px;
121 | border: 1px solid lightgrey;
122 | border-bottom-width: 2px;
123 | font-size: 17px;
124 | transition: all 0.3s ease;
125 | }
126 | .form-inner form .field input:focus{
127 | border-color: #fc83bb;
128 | }
129 | .form-inner form .field input::placeholder{
130 | color: #999;
131 | transition: all 0.3s ease;
132 | }
133 | form .field input:focus::placeholder{
134 | color: #b3b3b3;
135 | }
136 | .form-inner form .pass-link{
137 | margin-top: 5px;
138 | }
139 | .tit h2{
140 | padding-top: 5px;
141 | padding-bottom: 5px;
142 | }
143 | .wrapper .tit h2{
144 | font-size: 20px;
145 | border-style: double;
146 | }
147 | .form-inner form .pass-link a,
148 | .form-inner form .signup-link a{
149 | color: #fa4299;
150 | text-decoration: none;
151 | }
152 | .signup-link{
153 | padding-top: 35px;
154 | }
155 | form .btn{
156 | height: 50px;
157 | width: 100%;
158 | border-radius: 5px;
159 | position: relative;
160 | overflow: hidden;
161 | }
162 | form .btn .btn-layer{
163 | height: 100%;
164 | width: 300%;
165 | position: absolute;
166 | left: -100%;
167 | background: -webkit-linear-gradient(right, #a445b2, #fa4299, #a445b2, #fa4299);
168 | border-radius: 5px;
169 | transition: all 0.4s ease;;
170 | }
171 | form .btn input[type="button"]{
172 | height: 100%;
173 | width: 100%;
174 | z-index: 1;
175 | position: relative;
176 | background: none;
177 | border: none;
178 | color: #fff;
179 | padding-left: 0;
180 | border-radius: 5px;
181 | font-size: 20px;
182 | font-weight: 500;
183 | cursor: pointer;
184 | }
--------------------------------------------------------------------------------