sachin.ganesh
/
anwi_website
关注 1
点赞 0
派生 0
代码 工单 0 合并请求 0 版本发布 0 百科 动态
浏览代码

commit

sachinganesh 2 年前
父节点
475141e2d0
当前提交
6e3f74a33b
共有 18 个文件被更改，包括 1736 次插入 和 1511 次删除
分列视图 显示文件统计
  1. 451
    420
      allinone.html
  2. 10
    6
      dist/Js/footer.js
  3. 1
    1
      dist/Js/laptopmuti.js
  4. 19
    19
      dist/Js/navbar.js
  5. 二进制
      dist/assets/imgs/footer/facebook.png
  6. 二进制
      dist/assets/imgs/footer/instra.png
  7. 二进制
      dist/assets/imgs/footer/linkedin.png
  8. 二进制
      dist/assets/imgs/footer/twitter.png
  9. 二进制
      dist/assets/imgs/footer/youtube.png
  10. 二进制
      dist/assets/imgs/productoverview/productbg.png
  11. 139
    118
      index.html
  12. 944
    921
      laptopmulti.html
  13. 5
    7
      shopping-cart.html
  14. 5
    1
      styles/base/_utilities.scss
  15. 70
    13
      styles/pages/_home.scss
  16. 73
    4
      styles/style.css
  17. 1
    1
      styles/style.css.map
  18. 18
    0
      styles/style.scss

+ 451
- 420
allinone.html 查看文件 

@@ -14,124 +14,119 @@
14 14 
 </head>
15 15
16 16 
 <body>
17 
-
18 
-    <section class="allinoneLanding overflow-hidden">
19 
-        <!-- navbar -->
20 
-        <div id="navbar-head"></div>
21 
-        <!-- end-navbar -->
22 
-
23 
-        <!-- heading -->
24 
-        <div class="headingAllinOne px-6 orbitron_font w-100  text-white">
25 
-            <h1 class="font-5 ">All-in-One</h1>
26 
-            <div class="satoshi_font">AIO24 <span class="px-1 ">-</span>1700N</div>
27 
-        </div>
28 
-        <!-- heading end -->
29 
-    </section>
30 
-
31 
-    <section class="laptopsSection overflow-hidden">
32 
-        <div class="row ">
33 
-            <div class="col-sm-7 d-none d-sm-block clipPathSectionCol">
34 
-                <div class="leftClipPathLaptop">
35 
-                    <!-- <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100"> -->
36 
-                    <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100">
37 
-                </div>
38 
-                <div class="innerClipPathImg">
39 
-                    <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="w-100 h-100">
40 
-                </div>
41 
-            </div>
42 
-            <div class="align-items-center d-none d-sm-block col-sm-5 d-flex">
43 
-                <div class="d-flex flex-column justify-content-center h-100 gap-5">
44 
-                    <div>
45 
-                        <div class="font-1-5 supTitleSection">AIO24 - 1700N</div>
46 
-                        <div>
47 
-                            <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
48 
-                        </div>
17 
+    <div id="navbar-head"></div>
18 
+    <main class="main-body">
19 
+        <section class="allinoneLanding overflow-hidden">
20 
+            <!-- navbar -->
21 
+
22 
+            <!-- end-navbar -->
23 
+
24 
+            <!-- heading -->
25 
+            <!-- <div class="headingAllinOne px-6 orbitron_font w-100  text-white">
26 
+                <h1 class="font-5 ">All-in-One</h1>
27 
+                <div class="satoshi_font">AIO24 <span class="px-1 ">-</span>1700N</div>
28 
+            </div> -->
29 
+            <div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
30 
+                <div class="carousel-inner">
31 
+                  <div class="carousel-item active">
32 
+                    <img src="dist/assets/imgs/allinone/allinonebg.png" class="d-block w-100" alt="...">
33 
+                    <div class="headingAllinOne px-6 orbitron_font w-100  text-white">
34 
+                        <h1 class="font-5 ">All-in-One</h1>
35 
+                        <div class="satoshi_font">AIO24 <span class="px-1 ">-</span>1700N</div>
49 36 
                     </div>
50 
-                    <div class="font-2 headinglaptopSub">
51 
-                        <div class="satoshi_font">
52 
-                            Extraordinary Performance
53 
-
54 
-                        </div>
55 
-                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
37 
+                  </div>
38 
+                  <div class="carousel-item">
39 
+                    <img src="dist/assets/imgs/productoverview/productbg.png" class="d-block w-100" alt="...">
40 
+                  </div>
41 
+
42 
+                </div>
43 
+                <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="prev">
44 
+                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
45 
+                    <span class="visually-hidden">Previous</span>
46 
+                  </button>
47 
+                  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleControls" data-bs-slide="next">
48 
+                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
49 
+                    <span class="visually-hidden">Next</span>
50 
+                  </button>
51 
+              </div>
52 
+            <!-- heading end -->
53 
+        </section>
54 
+
55 
+        <section class="laptopsSection overflow-hidden">
56 
+            <div class="row ">
57 
+                <div class="col-sm-7 d-none d-sm-block clipPathSectionCol">
58 
+                    <div class="leftClipPathLaptop">
59 
+                        <!-- <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100"> -->
60 
+                        <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100">
56 61 
                     </div>
57 
-                    <div>
58 
-                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
62 
+                    <div class="innerClipPathImg">
63 
+                        <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="w-100 h-100">
59 64 
                     </div>
60 65 
                 </div>
61 
-            </div>
62 
-
63 
-
64 
-            <!-- mobile -->
65 
-            <div class="innerClipPathImg d-block d-sm-none">
66 
-                <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="img-fluid">
67 
-            </div>
68 
-            <div class="align-items-center d-sm-none d-block col-sm-5 d-flex">
69 
-                <div class="d-flex flex-column laptopSectionDesP gap-5">
70 
-                    <div>
71 
-                        <div class="font-1-5 supTitleSection">AIO24 - 1700N</div>
66 
+                <div class="align-items-center d-none d-sm-block col-sm-5 d-flex">
67 
+                    <div class="d-flex flex-column justify-content-center h-100 gap-5">
72 68 
                         <div>
73 
-                            <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
69 
+                            <div class="font-1-5 supTitleSection">AIO24 - 1700N</div>
70 
+                            <div>
71 
+                                <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
72 
+                            </div>
74 73 
                         </div>
75 
-                    </div>
76 
-                    <div class="font-2 headinglaptopSub">
77 
-                        <div class="satoshi_font">
78 
-                            Extraordinary Performance
79 
-
74 
+                        <div class="font-2 headinglaptopSub">
75 
+                            <div class="satoshi_font">
76 
+                                Extraordinary Performance
77 
+
78 
+                            </div>
79 
+                            <div class="satoshi_font"> and Unparalleled Flexibility</div>
80 
+                        </div>
81 
+                        <div>
82 
+                            <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
80 83 
                         </div>
81 
-                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
82 
-                    </div>
83 
-                    <div>
84 
-                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
85 84 
                     </div>
86 85 
                 </div>
87 
-            </div>
88 
-
89 
-            <div class="col-sm-7 d-sm-none d-block clipPathSectionCol">
90 
-                <div class="leftClipPathLaptop ">
91 
-                    <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100 d-none d-sm-block">
92 
-                </div>
93 
-                <div class="innerClipPathImg">
94 
-                    <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="w-100 h-100">
86 
+
87 
+
88 
+                <!-- mobile -->
89 
+                <div class="innerClipPathImg d-block d-sm-none">
90 
+                    <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="img-fluid">
95 91 
                 </div>
96 
-            </div>
97 
-
98 
-            <!-- mobile end -->
99 
-        </div>
100 
-    </section>
101 
-<!-- section 2 -->
102 
-    <section class="laptopsSection overflow-hidden">
103 
-        <div class="row ">
104 
-
105 
-            <div class="align-items-center d-none d-sm-block col-sm-5 p-6 d-flex">
106 
-                <div class="d-flex flex-column gap-5 laptopSectionDesP">
107 
-                    <div>
108 
-                        <div class="font-1-5">AIO24 - 1700N</div>
92 
+                <div class="align-items-center d-sm-none d-block col-sm-5 d-flex">
93 
+                    <div class="d-flex flex-column laptopSectionDesP gap-5">
109 94 
                         <div>
110 
-                            <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
95 
+                            <div class="font-1-5 supTitleSection">AIO24 - 1700N</div>
96 
+                            <div>
97 
+                                <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
98 
+                            </div>
111 99 
                         </div>
112 
-                    </div>
113 
-                    <div class="font-2 headinglaptopSub">
114 
-                        <div class="satoshi_font">
115 
-                            Extraordinary Performance
116 
-
100 
+                        <div class="font-2 headinglaptopSub">
101 
+                            <div class="satoshi_font">
102 
+                                Extraordinary Performance
103 
+
104 
+                            </div>
105 
+                            <div class="satoshi_font"> and Unparalleled Flexibility</div>
106 
+                        </div>
107 
+                        <div>
108 
+                            <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
117 109 
                         </div>
118 
-                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
119 110 
                     </div>
120 
-                    <div>
121 
-                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
111 
+                </div>
112 
+
113 
+                <div class="col-sm-7 d-sm-none d-block clipPathSectionCol">
114 
+                    <div class="leftClipPathLaptop ">
115 
+                        <img src="dist/assets/imgs/allinone/leftclippath.png" alt="" class="w-100 h-100 d-none d-sm-block">
116 
+                    </div>
117 
+                    <div class="innerClipPathImg">
118 
+                        <img src="dist/assets/imgs/allinone/onesection.png" alt="" class="w-100 h-100">
122 119 
                     </div>
123 120 
                 </div>
121 
+
122 
+                <!-- mobile end -->
124 123 
             </div>
125 
-            <div class="col-sm-7 clipPathSectionCol">
126 
-                <div class="innerClipPathImgSectionTwo  d-none d-sm-block">
127 
-                    <img src="dist/assets/imgs/allinone/sectiontwo.png" alt="" class="w-100 h-100 sectionTwoImgAllInone">
128 
-                </div>
129 
-
130 
-                <div>
131 
-                    <img src="dist/assets/imgs/allinone/sectiontwo.png" alt="" class="img-fluid d-block d-sm-none">
132 
-                </div>
133 
-
134 
-                <div class="align-items-center d-block d-sm-none col-sm-5 p-6 d-flex">
124 
+        </section>
125 
+    <!-- section 2 -->
126 
+        <section class="laptopsSection overflow-hidden">
127 
+            <div class="row ">
128 
+
129 
+                <div class="align-items-center d-none d-sm-block col-sm-5 p-6 d-flex">
135 130 
                     <div class="d-flex flex-column gap-5 laptopSectionDesP">
136 131 
                         <div>
137 132 
                             <div class="font-1-5">AIO24 - 1700N</div>
 
@@ -151,376 +146,407 @@
151 146 
                         </div>
152 147 
                     </div>
153 148 
                 </div>
154 
-
155 
-                <div class="leftClipPathLaptop d-none d-sm-block">
156 
-                    <img src="dist/assets/imgs/allinone/rightclippath.png" alt="" class="w-100 h-100">
157 
-                </div>
158 
-
159 
-            </div>
160 
-
161 
-
162 
-        </div>
163 
-    </section>
164 
-
165 
-<!-- section 2 end -->
166 
-
167 
-<!-- section 3 -->
168 
-
169 
-<section class="allinoneDualMarginTop overflow-hidden">
170 
-    <div class="row">
171 
-        <div class="col-sm-6 pe-5 clipPathSectionCol">
172 
-            <div class="leftClipPathLaptop d-none d-sm-block">
173 
-                <img src="dist/assets/imgs/allinone/ll.png" alt="" class="w-100 h-100">
174 
-            </div>
175 
-            <div class="innerClipPathImgFirstThree  d-none d-sm-block">
176 
-                <img src="dist/assets/imgs/allinone/montier.png" alt="" class="w-100 h-100">
177 
-            </div>
178 
-             <img src="dist/assets/imgs/allinone/montier.png" alt="" class="img-fluid d-block d-sm-none">
179 
-
180 
-            <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
181 
-                <div>
182 
-                    <h1 class="orbitron_font font-3">Moniters</h1>
183 
-                </div>
184 
-                <div class="font-1-5 allinoneDualMarginTop_p">
185 
-                    <div class="satoshi_font">
186 
-                        Extraordinary Performance
149 
+                <div class="col-sm-7 clipPathSectionCol">
150 
+                    <div class="innerClipPathImgSectionTwo  d-none d-sm-block">
151 
+                        <img src="dist/assets/imgs/allinone/sectiontwo.png" alt="" class="w-100 h-100 sectionTwoImgAllInone">
152 
+                    </div>
153 
+
154 
+                    <div>
155 
+                        <img src="dist/assets/imgs/allinone/sectiontwo.png" alt="" class="img-fluid d-block d-sm-none">
156 
+                    </div>
157 
+
158 
+                    <div class="align-items-center d-block d-sm-none col-sm-5 p-6 d-flex">
159 
+                        <div class="d-flex flex-column gap-5 laptopSectionDesP">
160 
+                            <div>
161 
+                                <div class="font-1-5">AIO24 - 1700N</div>
162 
+                                <div>
163 
+                                    <h1 class="font-7 orbitron_font headinglaptop">Laptops</h1>
164 
+                                </div>
165 
+                            </div>
166 
+                            <div class="font-2 headinglaptopSub">
167 
+                                <div class="satoshi_font">
168 
+                                    Extraordinary Performance
187 169
170 
+                                </div>
171 
+                                <div class="satoshi_font"> and Unparalleled Flexibility</div>
172 
+                            </div>
173 
+                            <div>
174 
+                                <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
175 
+                            </div>
176 
+                        </div>
188 177 
                     </div>
189 
-                    <div class="satoshi_font"> and Unparalleled Flexibility</div>
190 
-                </div>
191 
-                <div>
192 
-                    <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
178 
+
179 
+                    <div class="leftClipPathLaptop d-none d-sm-block">
180 
+                        <img src="dist/assets/imgs/allinone/rightclippath.png" alt="" class="w-100 h-100">
181 
+                    </div>
182 
+
193 183 
                 </div>
194 
-               </div>
195 
-        </div>
196 
-        <div class="col-sm-6 ps-5 clipPathSectionCol">
197 
-            <div class="leftClipPathLaptop d-none d-sm-block">
198 
-                <img src="dist/assets/imgs/allinone/rr.png" alt="" class="w-100 h-100">
199 
-            </div>
200 
-            <div class="innerClipPathImgSectionThree d-none d-sm-block">
201 
-                <img src="dist/assets/imgs/allinone/keyboardandmouse.png" alt="" class="w-100 h-100 ">
184 
+
185 
+
202 186 
             </div>
203 
-            <img src="dist/assets/imgs/allinone/keyboardandmouse.png" alt="" class="img-fluid d-block d-sm-none">
204 
-
205 
-            <div class="d-flex  d-sm-none d-block allinoneDualMarginTop_pContainer flex-column gap-5">
206 
-                <div>
207 
-                    <h1 class="orbitron_font font-3">Moniters</h1>
187 
+        </section>
188 
+
189 
+    <!-- section 2 end -->
190 
+
191 
+    <!-- section 3 -->
192 
+
193 
+    <section class="allinoneDualMarginTop overflow-hidden">
194 
+        <div class="row">
195 
+            <div class="col-sm-6 pe-5 clipPathSectionCol">
196 
+                <div class="leftClipPathLaptop d-none d-sm-block">
197 
+                    <img src="dist/assets/imgs/allinone/ll.png" alt="" class="w-100 h-100">
208 198 
                 </div>
209 
-                <div class="font-1-5 allinoneDualMarginTop_p">
210 
-                    <div class="satoshi_font">
211 
-                        Extraordinary Performance
212 
-
199 
+                <div class="innerClipPathImgFirstThree  d-none d-sm-block">
200 
+                    <img src="dist/assets/imgs/allinone/montier.png" alt="" class="w-100 h-100">
201 
+                </div>
202 
+                 <img src="dist/assets/imgs/allinone/montier.png" alt="" class="img-fluid d-block d-sm-none">
203 
+
204 
+                <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
205 
+                    <div>
206 
+                        <h1 class="orbitron_font font-3">Moniters</h1>
207 
+                    </div>
208 
+                    <div class="font-1-5 allinoneDualMarginTop_p">
209 
+                        <div class="satoshi_font">
210 
+                            Extraordinary Performance
211 
+
212 
+                        </div>
213 
+                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
213 214 
                     </div>
214 
-                    <div class="satoshi_font"> and Unparalleled Flexibility</div>
215 
+                    <div>
216 
+                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
217 
+                    </div>
218 
+                   </div>
219 
+            </div>
220 
+            <div class="col-sm-6 ps-5 clipPathSectionCol">
221 
+                <div class="leftClipPathLaptop d-none d-sm-block">
222 
+                    <img src="dist/assets/imgs/allinone/rr.png" alt="" class="w-100 h-100">
215 223 
                 </div>
216 
-                <div>
217 
-                    <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
224 
+                <div class="innerClipPathImgSectionThree d-none d-sm-block">
225 
+                    <img src="dist/assets/imgs/allinone/keyboardandmouse.png" alt="" class="w-100 h-100 ">
218 226 
                 </div>
219 
-               </div>
220 
-        </div>
221 
-    </div>
222 
-    <div class="d-flex justify-content-between allinoneDualMarginTop_desContainer p-7 d-none d-sm-flex">
223 
-       <div class="d-flex flex-column gap-5">
224 
-        <div>
225 
-            <h1 class="orbitron_font font-3">Moniters</h1>
226 
-        </div>
227 
-        <div class="font-1-5 allinoneDualMarginTop_p">
228 
-            <div class="satoshi_font">
229 
-                Extraordinary Performance
230 
-
227 
+                <img src="dist/assets/imgs/allinone/keyboardandmouse.png" alt="" class="img-fluid d-block d-sm-none">
228 
+
229 
+                <div class="d-flex  d-sm-none d-block allinoneDualMarginTop_pContainer flex-column gap-5">
230 
+                    <div>
231 
+                        <h1 class="orbitron_font font-3">Moniters</h1>
232 
+                    </div>
233 
+                    <div class="font-1-5 allinoneDualMarginTop_p">
234 
+                        <div class="satoshi_font">
235 
+                            Extraordinary Performance
236 
+
237 
+                        </div>
238 
+                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
239 
+                    </div>
240 
+                    <div>
241 
+                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
242 
+                    </div>
243 
+                   </div>
231 244 
             </div>
232 
-            <div class="satoshi_font"> and Unparalleled Flexibility</div>
233 
-        </div>
234 
-        <div>
235 
-            <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
236 245 
         </div>
237 
-       </div>
238 
-       <div class="d-flex flex-column gap-5">
239 
-        <div>
240 
-            <h1 class="orbitron_font font-3">Peripherals</h1>
241 
-        </div>
242 
-        <div class="font-1-5 allinoneDualMarginTop_p">
243 
-            <div class="satoshi_font">
244 
-                Extraordinary Performance
245 
-
246 
+        <div class="d-flex justify-content-between allinoneDualMarginTop_desContainer p-7 d-none d-sm-flex">
247 
+           <div class="d-flex flex-column gap-5">
248 
+            <div>
249 
+                <h1 class="orbitron_font font-3">Moniters</h1>
246 250 
             </div>
247 
-            <div class="satoshi_font"> and Unparalleled Flexibility</div>
248 
-        </div>
249 
-        <div>
250 
-            <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
251 
-        </div>
252 
-       </div>
253 
-    </div>
254 
-</section>
255 
-
256 
-<!-- section 3 end -->
257 
-
258 
-<!-- section 4 -->
259 
-
260 
-<section class=" overflow-hidden allinoneDualMarginTop">
261 
-    <div class="row">
262 
-        <div class="col-sm-6 pe-5 clipPathSectionCol">
263 
-            <div class="leftClipPathLaptop ">
264 
-                <img src="dist/assets/imgs/allinone/ll.png" alt="" class="w-100 h-100  d-none d-sm-block">
251 
+            <div class="font-1-5 allinoneDualMarginTop_p">
252 
+                <div class="satoshi_font">
253 
+                    Extraordinary Performance
254 
+
255 
+                </div>
256 
+                <div class="satoshi_font"> and Unparalleled Flexibility</div>
265 257 
             </div>
266 
-            <div class="innerClipPathImgFirstFour">
267 
-                <img src="dist/assets/imgs/allinone/cpus.png" alt="" class="w-100 h-100  d-none d-sm-block">
258 
+            <div>
259 
+                <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
268 260 
             </div>
269 
-            <img src="dist/assets/imgs/allinone/cpus.png" alt="" class="img-fluid d-block d-sm-none">
270 
-
271 
-            <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
272 
-                <div>
273 
-                    <h1 class="orbitron_font font-3">Moniters</h1>
274 
-                </div>
275 
-                <div class="font-1-5 allinoneDualMarginTop_p">
276 
-                    <div class="satoshi_font">
277 
-                        Extraordinary Performance
278 
-
279 
-                    </div>
280 
-                    <div class="satoshi_font"> and Unparalleled Flexibility</div>
281 
-                </div>
282 
-                <div>
283 
-                    <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
261 
+           </div>
262 
+           <div class="d-flex flex-column gap-5">
263 
+            <div>
264 
+                <h1 class="orbitron_font font-3">Peripherals</h1>
265 
+            </div>
266 
+            <div class="font-1-5 allinoneDualMarginTop_p">
267 
+                <div class="satoshi_font">
268 
+                    Extraordinary Performance
269 
+
284 270 
                 </div>
285 
-               </div>
286 
-        </div>
287 
-        <div class="col-sm-6 ps-5 clipPathSectionCol">
288 
-            <div class="leftClipPathLaptop ">
289 
-                <img src="dist/assets/imgs/allinone/rr.png" alt="" class="w-100 h-100  d-none d-sm-block">
271 
+                <div class="satoshi_font"> and Unparalleled Flexibility</div>
290 272 
             </div>
291 
-            <div class="innerClipPathImgSectionFour">
292 
-
293 
-                <img src="dist/assets/imgs/allinone/rams.png" alt="" class="w-100 h-100  d-none d-sm-block">
273 
+            <div>
274 
+                <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
294 275 
             </div>
295 
-            <img src="dist/assets/imgs/allinone/rams.png" alt="" class="img-fluid d-block d-sm-none">
296 
-            <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
297 
-                <div>
298 
-                    <h1 class="orbitron_font font-3">Moniters</h1>
276 
+           </div>
277 
+        </div>
278 
+    </section>
279 
+
280 
+    <!-- section 3 end -->
281 
+
282 
+    <!-- section 4 -->
283 
+
284 
+    <section class=" overflow-hidden allinoneDualMarginTop">
285 
+        <div class="row">
286 
+            <div class="col-sm-6 pe-5 clipPathSectionCol">
287 
+                <div class="leftClipPathLaptop ">
288 
+                    <img src="dist/assets/imgs/allinone/ll.png" alt="" class="w-100 h-100  d-none d-sm-block">
299 289 
                 </div>
300 
-                <div class="font-1-5 allinoneDualMarginTop_p">
301 
-                    <div class="satoshi_font">
302 
-                        Extraordinary Performance
303 
-
290 
+                <div class="innerClipPathImgFirstFour">
291 
+                    <img src="dist/assets/imgs/allinone/cpus.png" alt="" class="w-100 h-100  d-none d-sm-block">
292 
+                </div>
293 
+                <img src="dist/assets/imgs/allinone/cpus.png" alt="" class="img-fluid d-block d-sm-none">
294 
+
295 
+                <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
296 
+                    <div>
297 
+                        <h1 class="orbitron_font font-3">Moniters</h1>
298 
+                    </div>
299 
+                    <div class="font-1-5 allinoneDualMarginTop_p">
300 
+                        <div class="satoshi_font">
301 
+                            Extraordinary Performance
302 
+
303 
+                        </div>
304 
+                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
305 
+                    </div>
306 
+                    <div>
307 
+                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
304 308 
                     </div>
305 
-                    <div class="satoshi_font"> and Unparalleled Flexibility</div>
309 
+                   </div>
310 
+            </div>
311 
+            <div class="col-sm-6 ps-5 clipPathSectionCol">
312 
+                <div class="leftClipPathLaptop ">
313 
+                    <img src="dist/assets/imgs/allinone/rr.png" alt="" class="w-100 h-100  d-none d-sm-block">
306 314 
                 </div>
307 
-                <div>
308 
-                    <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
315 
+                <div class="innerClipPathImgSectionFour">
316 
+
317 
+                    <img src="dist/assets/imgs/allinone/rams.png" alt="" class="w-100 h-100  d-none d-sm-block">
309 318 
                 </div>
310 
-               </div>
319 
+                <img src="dist/assets/imgs/allinone/rams.png" alt="" class="img-fluid d-block d-sm-none">
320 
+                <div class="d-flex d-sm-none allinoneDualMarginTop_pContainer d-block flex-column gap-5">
321 
+                    <div>
322 
+                        <h1 class="orbitron_font font-3">Moniters</h1>
323 
+                    </div>
324 
+                    <div class="font-1-5 allinoneDualMarginTop_p">
325 
+                        <div class="satoshi_font">
326 
+                            Extraordinary Performance
327 
+
328 
+                        </div>
329 
+                        <div class="satoshi_font"> and Unparalleled Flexibility</div>
330 
+                    </div>
331 
+                    <div>
332 
+                        <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
333 
+                    </div>
334 
+                   </div>
335 
+            </div>
311 336 
         </div>
312 
-    </div>
313 
-    <div class="d-flex justify-content-between allinoneDualMarginTop_desContainer p-7 d-none d-sm-flex">
314 
-        <div class="d-flex flex-column gap-5">
315 
-         <div>
316 
-             <h1 class="orbitron_font font-3">Moniters</h1>
317 
-         </div>
318 
-         <div class="font-1-5 allinoneDualMarginTop_p">
319 
-             <div class="satoshi_font">
320 
-                 Extraordinary Performance
321 
-
337 
+        <div class="d-flex justify-content-between allinoneDualMarginTop_desContainer p-7 d-none d-sm-flex">
338 
+            <div class="d-flex flex-column gap-5">
339 
+             <div>
340 
+                 <h1 class="orbitron_font font-3">Moniters</h1>
322 341 
              </div>
323 
-             <div class="satoshi_font"> and Unparalleled Flexibility</div>
324 
-         </div>
325 
-         <div>
326 
-             <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
327 
-         </div>
328 
-        </div>
329 
-        <div class="d-flex flex-column gap-5">
330 
-         <div>
331 
-             <h1 class="orbitron_font font-3">Peripherals</h1>
332 
-         </div>
333 
-         <div class="font-1-5 allinoneDualMarginTop_p">
334 
-             <div class="satoshi_font">
335 
-                 Extraordinary Performance
336 
-
342 
+             <div class="font-1-5 allinoneDualMarginTop_p">
343 
+                 <div class="satoshi_font">
344 
+                     Extraordinary Performance
345 
+
346 
+                 </div>
347 
+                 <div class="satoshi_font"> and Unparalleled Flexibility</div>
337 348 
              </div>
338 
-             <div class="satoshi_font"> and Unparalleled Flexibility</div>
339 
-         </div>
340 
-         <div>
341 
-             <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
349 
+             <div>
350 
+                 <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
351 
+             </div>
352 
+            </div>
353 
+            <div class="d-flex flex-column gap-5">
354 
+             <div>
355 
+                 <h1 class="orbitron_font font-3">Peripherals</h1>
356 
+             </div>
357 
+             <div class="font-1-5 allinoneDualMarginTop_p">
358 
+                 <div class="satoshi_font">
359 
+                     Extraordinary Performance
360 
+
361 
+                 </div>
362 
+                 <div class="satoshi_font"> and Unparalleled Flexibility</div>
363 
+             </div>
364 
+             <div>
365 
+                 <a class="btn btn-dark button_dark font-1-2" href="#">Learn More</a>
366 
+             </div>
367 
+            </div>
342 368 
          </div>
343 
-        </div>
344 
-     </div>
345 
-</section>
346 
-
347 
-<!-- section 4 end -->
348 
-
349 
-<!-- section 5 -->
350 
-<section class="sectionfiveAllinOne container  overflow-hidden">
351 
-    <div class="row">
352 
-        <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
353 
-            <img class="w-100 h-100" src="dist/assets/imgs/allinone/info1.png" alt="">
354 
-            <div class="orbitron_font text-white infoContainerOneText">
355 
-                <h1>Announcements</h1>
356 
-                <h1>and Events</h1>
369 
+    </section>
370 
+
371 
+    <!-- section 4 end -->
372 
+
373 
+    <!-- section 5 -->
374 
+    <section class="sectionfiveAllinOne container  overflow-hidden">
375 
+        <div class="row">
376 
+            <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
377 
+                <img class="w-100 h-100" src="dist/assets/imgs/allinone/info1.png" alt="">
378 
+                <div class="orbitron_font text-white infoContainerOneText">
379 
+                    <h1>Announcements</h1>
380 
+                    <h1>and Events</h1>
381 
+                </div>
357 382 
             </div>
358 
-        </div>
359 
-        <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
360 
-            <img class="w-100 h-70" src="dist/assets/imgs/allinone/info2.png" alt="">
361 
-            <!-- <img class="w-100 h-70" src="dist/assets/imgs/allinone/info2.png" alt=""> -->
362 
-            <div class=" infoContainerBlue  p-4 d-flex flex-column justify-content-center ">
363 
-                <h1 class="font-1-5  orbitron_font">Solution Focus</h1>
364 
-                <div class="infoContainer_des satoshi_font">
365 
-                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
383 
+            <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
384 
+                <img class="w-100 h-70" src="dist/assets/imgs/allinone/info2.png" alt="">
385 
+                <!-- <img class="w-100 h-70" src="dist/assets/imgs/allinone/info2.png" alt=""> -->
386 
+                <div class=" infoContainerBlue  p-4 d-flex flex-column justify-content-center ">
387 
+                    <h1 class="font-1-5  orbitron_font">Solution Focus</h1>
388 
+                    <div class="infoContainer_des satoshi_font">
389 
+                        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
390 
+                    </div>
366 391 
                 </div>
367 392 
             </div>
368 
-        </div>
369 
-        <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
370 
-            <img class="w-100 h-70" src="dist/assets/imgs/allinone/info3.png" alt="">
371 
-            <div class=" infoContainerOrange  p-4 d-flex flex-column justify-content-center ">
372 
-                <h1 class="font-1-5  orbitron_font">Restless</h1>
373 
-                <div class="infoContainer_des satoshi_font">
374 
-                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
393 
+            <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
394 
+                <img class="w-100 h-70" src="dist/assets/imgs/allinone/info3.png" alt="">
395 
+                <div class=" infoContainerOrange  p-4 d-flex flex-column justify-content-center ">
396 
+                    <h1 class="font-1-5  orbitron_font">Restless</h1>
397 
+                    <div class="infoContainer_des satoshi_font">
398 
+                        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
399 
+                    </div>
375 400 
                 </div>
376 401 
             </div>
377 
-        </div>
378 
-        <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
379 
-            <img class="w-100 h-70" src="dist/assets/imgs/allinone/info4.png" alt="">
380 
-            <div class=" infoContainerBlue  p-4 d-flex flex-column justify-content-center ">
381 
-                <h1 class="font-1-5  orbitron_font">Out of world</h1>
382 
-                <div class="infoContainer_des satoshi_font">
383 
-                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
402 
+            <div class="col-sm-12 col-md-6 col-lg-3 infoContainer">
403 
+                <img class="w-100 h-70" src="dist/assets/imgs/allinone/info4.png" alt="">
404 
+                <div class=" infoContainerBlue  p-4 d-flex flex-column justify-content-center ">
405 
+                    <h1 class="font-1-5  orbitron_font">Out of world</h1>
406 
+                    <div class="infoContainer_des satoshi_font">
407 
+                        Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invconsetetur sadipscing elitr, sed
408 
+                    </div>
384 409 
                 </div>
385 410 
             </div>
386 411 
         </div>
387 
-    </div>
388 
-</section>
389 
-<!-- section 5 end -->
390 
-
391 
-<!-- section 6 -->
392 
-<section>
393 
-   <div class=" d-flex flex-column justify-content-center align-items-center overflow-hidden">
394 
-    <h1 class="orbitron_font pb-0 p-6 insightsAdvHeading">Insights / Advance</h1>
395 
-    <div class="d-none">
396 
-        <div class="p-6 pt-5 insightsAdv">
397 
-            <ul class="list-inline d-flex gap-5">
398 
-                <li class="cursor-pointer orbitron_font fw-600">Server</li>
399 
-                <li class="cursor-pointer orbitron_font"  data-hash="3"> servers</li>
400 
-                <li class="cursor-pointer orbitron_font"> servers</li>
401 
-                <li class="cursor-pointer orbitron_font"> servers</li>
402 
-                <li class="cursor-pointer orbitron_font"> servers</li>
403 
-            </ul>
404 
-        </div>
405 
-
406 
-    </div>
407 
-    <div class="carouselLanding owl-carousel d-flex p-4">
408 
-        <div class="carouselLandingItem">
409 
-           <div class="mt-5C carouselLandingItemInner">
410 
-            <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
411 
-            <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
412 
-
413 
-<svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
414 
-    <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
415 
-  </svg>
416 
-
412 
+    </section>
413 
+    <!-- section 5 end -->
414 
+
415 
+    <!-- section 6 -->
416 
+    <section>
417 
+       <div class=" d-flex flex-column justify-content-center align-items-center overflow-hidden">
418 
+        <h1 class="orbitron_font pb-0 p-6 insightsAdvHeading">Insights / Advance</h1>
419 
+        <div class="d-none">
420 
+            <div class="p-6 pt-5 insightsAdv">
421 
+                <ul class="list-inline d-flex gap-5">
422 
+                    <li class="cursor-pointer orbitron_font fw-600">Server</li>
423 
+                    <li class="cursor-pointer orbitron_font"  data-hash="3"> servers</li>
424 
+                    <li class="cursor-pointer orbitron_font"> servers</li>
425 
+                    <li class="cursor-pointer orbitron_font"> servers</li>
426 
+                    <li class="cursor-pointer orbitron_font"> servers</li>
427 
+                </ul>
417 428 
             </div>
418 
-           </div>
429 
+
419 430 
         </div>
420 
-        <div class="carouselLandingItem ">
421 
-            <div class=" carouselLandingItemInner">
422 
-             <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
423 
-             <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
424 
-
425 
- <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
426 
-     <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
427 
-   </svg>
428 
-
429 
-             </div>
431 
+        <div class="carouselLanding owl-carousel d-flex p-4">
432 
+            <div class="carouselLandingItem">
433 
+               <div class="mt-5C carouselLandingItemInner">
434 
+                <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
435 
+                <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
436 
+
437 
+    <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
438 
+        <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
439 
+      </svg>
440 
+
441 
+                </div>
442 
+               </div>
430 443 
             </div>
431 
-         </div>
444 
+            <div class="carouselLandingItem ">
445 
+                <div class=" carouselLandingItemInner">
446 
+                 <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
447 
+                 <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
448 
+
449 
+     <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
450 
+         <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
451 
+       </svg>
432 452
433 
-        <div class="carouselLandingItem " data-hash="3">
434 
-            <div class="mt-5C carouselLandingItemInner">
435 
-             <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
436 
-             <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
437 
-
438 
- <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
439 
-     <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
440 
-   </svg>
441 
-
453 
+                 </div>
454 
+                </div>
442 455 
              </div>
443 
-            </div>
444 
-         </div>
456 
+
457 
+            <div class="carouselLandingItem " data-hash="3">
458 
+                <div class="mt-5C carouselLandingItemInner">
459 
+                 <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
460 
+                 <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
461 
+
462 
+     <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
463 
+         <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
464 
+       </svg>
445 465
446 
-        <div class="carouselLandingItem">
447 
-            <div class=" carouselLandingItemInner">
448 
-             <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
449 
-             <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
450 
-
451 
- <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
452 
-     <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
453 
-   </svg>
454 
-
466 
+                 </div>
467 
+                </div>
455 468 
              </div>
456 
-            </div>
457 
-         </div>
458 
-         <div class="carouselLandingItem ">
459 
-            <div class="mt-5C carouselLandingItemInner">
460 
-             <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
461 
-             <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
462 
-
463 
- <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
464 
-     <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
465 
-   </svg>
466 
-
469 
+
470 
+            <div class="carouselLandingItem">
471 
+                <div class=" carouselLandingItemInner">
472 
+                 <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
473 
+                 <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
474 
+
475 
+     <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
476 
+         <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
477 
+       </svg>
478 
+
479 
+                 </div>
480 
+                </div>
467 481 
              </div>
468 
-            </div>
469 
-         </div>
482 
+             <div class="carouselLandingItem ">
483 
+                <div class="mt-5C carouselLandingItemInner">
484 
+                 <img src="dist/assets/imgs/allinone/scroll.png" alt="" class="w-100 h-100">
485 
+                 <div class="carouselLandingItemInnerOverlay d-flex justify-content-center align-items-center">
486 
+
487 
+     <svg xmlns="http://www.w3.org/2000/svg" width="49.176" height="49.176" viewBox="0 0 49.176 49.176">
488 
+         <path id="Icon_awesome-play-circle" data-name="Icon awesome-play-circle" d="M25.15.563A24.588,24.588,0,1,0,49.738,25.15,24.584,24.584,0,0,0,25.15.563ZM36.621,27.53,19.172,37.543a2.384,2.384,0,0,1-3.539-2.082V14.839a2.385,2.385,0,0,1,3.539-2.082L36.621,23.366A2.387,2.387,0,0,1,36.621,27.53Z" transform="translate(-0.563 -0.563)" fill="#fff"/>
489 
+       </svg>
470 490
471 
-    </div>
472 
-   </div>
473 
-
474 
-</section>
475 
-<!-- section 6 end -->
476 
-
477 
-<!-- section 7 -->
478 
-<section class="p-6 d-flex flex-column justify-content-center overflow-hidden align-items-center ">
479 
-    <h1 class="orbitron_font pb-5">Support / Download</h1>
480 
-    <div class="row supportBoxParent">
481 
-            <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
482 
-                <div class="d-flex flex-column justify-content-center align-items-center">
483 
-                    <div class="supportBoxCircle"></div>
491 
+                 </div>
484 492 
                 </div>
485 
-                <div class="d-flex flex-column gap-3">
486 
-                    <div class="text-center font-1-2 orbitron_font fw-600">
487 
-                        Product Registration
493 
+             </div>
494 
+
495 
+        </div>
496 
+       </div>
497 
+
498 
+    </section>
499 
+    <!-- section 6 end -->
500 
+
501 
+    <!-- section 7 -->
502 
+    <section class="p-6 d-flex flex-column justify-content-center overflow-hidden align-items-center ">
503 
+        <h1 class="orbitron_font pb-5">Support / Download</h1>
504 
+        <div class="row supportBoxParent">
505 
+                <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
506 
+                    <div class="d-flex flex-column justify-content-center align-items-center">
507 
+                        <div class="supportBoxCircle"></div>
488 508 
                     </div>
489 
-                    <div class="text-center satoshi_font">
490 
-                        Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
509 
+                    <div class="d-flex flex-column gap-3">
510 
+                        <div class="text-center font-1-2 orbitron_font fw-600">
511 
+                            Product Registration
512 
+                        </div>
513 
+                        <div class="text-center satoshi_font">
514 
+                            Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
515 
+                        </div>
491 516 
                     </div>
492 517 
                 </div>
493 
-            </div>
494 
-            <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
495 
-                <div class="d-flex flex-column justify-content-center align-items-center">
496 
-                    <div class="supportBoxCircle"></div>
497 
-                </div>
498 
-                <div class="d-flex flex-column gap-3">
499 
-                    <div class="text-center font-1-2 orbitron_font fw-600">
500 
-                        Product Warranty
518 
+                <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
519 
+                    <div class="d-flex flex-column justify-content-center align-items-center">
520 
+                        <div class="supportBoxCircle"></div>
501 521 
                     </div>
502 
-                    <div class="text-center satoshi_font">
503 
-                        Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
522 
+                    <div class="d-flex flex-column gap-3">
523 
+                        <div class="text-center font-1-2 orbitron_font fw-600">
524 
+                            Product Warranty
525 
+                        </div>
526 
+                        <div class="text-center satoshi_font">
527 
+                            Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
528 
+                        </div>
504 529 
                     </div>
505 530 
                 </div>
506 
-            </div>
507 
-            <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
508 
-                <div class="d-flex flex-column justify-content-center align-items-center">
509 
-                    <div class="supportBoxCircle"></div>
510 
-                </div>
511 
-                <div class="d-flex flex-column gap-3">
512 
-                    <div class="text-center font-1-2 orbitron_font fw-600">
513 
-                        Customer /  Support
531 
+                <div class="supportBox col-sm-4 gap-4 d-flex flex-column justify-content-center align-items-center">
532 
+                    <div class="d-flex flex-column justify-content-center align-items-center">
533 
+                        <div class="supportBoxCircle"></div>
514 534 
                     </div>
515 
-                    <div class="text-center satoshi_font">
516 
-                        Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
535 
+                    <div class="d-flex flex-column gap-3">
536 
+                        <div class="text-center font-1-2 orbitron_font fw-600">
537 
+                            Customer /  Support
538 
+                        </div>
539 
+                        <div class="text-center satoshi_font">
540 
+                            Lorem ipsum dolor sit amet, consetetur sadipscing elitamet.
541 
+                        </div>
517 542 
                     </div>
518 543 
                 </div>
519 
-            </div>
520 
-
521 
-
522 
-    </div>
523 
-</section>
544 
+
545 
+
546 
+        </div>
547 
+    </section>
548 
+
549 
+    </main>
524 550 
 <!-- section 7 end -->
525 551 
     <!-- footer -->
526 552 
     <section id="footer-head"></section>
 
@@ -538,6 +564,11 @@
538 564 
     <script src="dist/Js/footer.js"></script>
539 565 
     <script src="dist/Js/laptopmuti.js"></script>
540 566
567 
+    <script>
568 
+
569 
+        $('#navbar-head').css("background","rgba( 255, 255, 255, 0.25 )")
570 
+    </script>
571 
+
541 572 
 </body>
542 573
543 574 
 </html>

+ 10
- 6
dist/Js/footer.js 查看文件 

@@ -256,31 +256,31 @@ $(document).ready(function() {
256 256 
                                 <li>
257 257 
                                     <ul class="d-flex
258 258 
                                             list-inline">
259 
-                                        <li><img src="" alt="logo"></li>
259 
+                                        <li class="footer-socailImg"><img src="dist/assets/imgs/footer/twitter.png" alt="logo" class="px-1 img-fluid"></li>
260 260 
                                         <li>Twitter</li>
261 261 
                                     </ul>
262 262 
                                 </li>
263 263 
                                 <li>
264 264 
                                     <ul class="d-flex list-inline">
265 
-                                        <li><img src="" alt="logo"></li>
265 
+                                        <li class="footer-socailImg"><img src="dist/assets/imgs/footer/instra.png" alt="logo" class="px-1 img-fluid"></li>
266 266 
                                         <li>Instagram</li>
267 267 
                                     </ul>
268 268 
                                 </li>
269 269 
                                 <li>
270 270 
                                     <ul class="d-flex list-inline">
271 
-                                        <li><img src="" alt="logo"></li>
271 
+                                        <li class="footer-socailImg"><img src="dist/assets/imgs/footer/youtube.png" alt="logo" class="px-1 img-fluid"></li>
272 272 
                                         <li>Youtube</li>
273 273 
                                     </ul>
274 274 
                                 </li>
275 275 
                                 <li>
276 276 
                                     <ul class="d-flex list-inline">
277 
-                                        <li><img src="" alt="logo"></li>
277 
+                                        <li class="footer-socailImg"><img src="dist/assets/imgs/footer/linkedin.png" alt="logo" class="px-1 img-fluid"></li>
278 278 
                                         <li>Linkedin</li>
279 279 
                                     </ul>
280 280 
                                 </li>
281 281 
                                 <li>
282 282 
                                     <ul class="d-flex list-inline">
283 
-                                        <li><img src="" alt="logo"></li>
283 
+                                        <li class="footer-socailImg"><img src="dist/assets/imgs/footer/facebook.png" alt="logo" class="px-1 img-fluid"></li>
284 284 
                                         <li>Facebook</li>
285 285 
                                     </ul>
286 286 
                                 </li>
 
@@ -299,7 +299,7 @@ $(document).ready(function() {
299 299 
             <div class="container">
300 300 
                 <div class="row g-0 py-4 align-items-center">
301 301 
                     <div class="col-md-5 text-white">
302 
-                        <p class="mb-0">Copyright © 2022 Anwisystems pvt ltd. All rights reserved.</p>
302 
+                        <p class="mb-0">Copyright ©${new Date().getFullYear()} Anwisystems pvt ltd. All rights reserved.</p>
303 303 
                     </div>
304 304 
                     <div class="col-md-2 text-white border-end
305 305 
                             text-center">
 
@@ -335,4 +335,8 @@ $(document).ready(function() {
335 335 
 </footer>`;
336 336
337 337 
     $("#footer-head").html(footerHtml);
338 
+
339 
+    $("[alt=footer-rocket-img]").click(function(e){
340 
+        document.documentElement.scrollTop = 0;
341 
+    })
338 342 
 });

+ 1
- 1
dist/Js/laptopmuti.js 查看文件 

@@ -11,4 +11,4 @@ function callMain(){
11 11 
     callGallery();
12 12 
 }
13 13
14 
-callMain();
14 
+callMain();

+ 19
- 19
dist/Js/navbar.js 查看文件 

@@ -69,25 +69,25 @@ $(document).ready(function() {
69 69 
     //on-scroll-nav
70 70 
     var c,
71 71 
         currentScrollTop = 0,
72 
-        navbar = $("#biz-main-nav");
72 
+        navbar = $("#navbar-head");
73 73
74 
-    $(window).scroll(function() {
75 
-        var a = $(window).scrollTop();
76 
-        var b = navbar.height();
77 
-        currentScrollTop = a;
74 
+    // $(window).scroll(function() {
75 
+    //     var a = $(window).scrollTop();
76 
+    //     var b = navbar.height();
77 
+    //     currentScrollTop = a;
78 78
79 
-        if (c < currentScrollTop && a > b + b) {
80 
-            if ($("#navbarNavDropdown").hasClass("show") == false) {
81 
-                navbar.addClass("scrollUp");
82 
-                $(".workflow-pills").removeClass("top-space");
83 
-            }
84 
-        } else if (c > currentScrollTop && !(a <= b)) {
85 
-            navbar.removeClass("scrollUp");
86 
-            $(".workflow-pills").addClass("top-space");
87 
-        }
79 
+    //     // if (c < currentScrollTop && a > b + b) {
80 
+    //     //     if ($("#navbarNavDropdown").hasClass("show") == false) {
81 
+    //     //         navbar.addClass("scrollUp");
82 
+    //     //         $(".workflow-pills").removeClass("top-space");
83 
+    //     //     }
84 
+    //     // } else if (c > currentScrollTop && !(a <= b)) {
85 
+    //     //     navbar.removeClass("scrollUp");
86 
+    //     //     $(".workflow-pills").addClass("top-space");
87 
+    //     // }
88 88
89 
-        c = currentScrollTop;
90 
-    });
89 
+    //     c = currentScrollTop;
90 
+    // });
91 91
92 92 
     var scroll_start = 0;
93 93 
     var startchange = $(".main-body");
 
@@ -96,19 +96,19 @@ $(document).ready(function() {
96 96 
         $(document).scroll(function() {
97 97 
             scroll_start = $(this).scrollTop();
98 98 
             if (scroll_start > offset.top) {
99 
-                $(".index-new")
99 
+                $("#navbar-head")
100 100 
                     .find(".navbar")
101 101 
                     .css("background-color", "#fff")
102 102 
                     .css("box-shadow", "0px 12px 20px -25px");
103 103 
             } else {
104 
-                $(".index-new")
104 
+                $("#navbar-head")
105 105 
                     .find(".navbar")
106 106 
                     .css("background-color", "transparent")
107 107 
                     .css("box-shadow", "none");
108 108 
             }
109 109 
         });
110 110 
     } else {
111 
-        $(".index-new")
111 
+        $("#navbar-head")
112 112 
             .find(".navbar")
113 113 
             .css("background-color", "#fff")
114 114 
             .css("box-shadow", "0px 12px 20px -25px");

二进制
dist/assets/imgs/footer/facebook.png 查看文件


二进制
dist/assets/imgs/footer/instra.png 查看文件


二进制
dist/assets/imgs/footer/linkedin.png 查看文件


二进制
dist/assets/imgs/footer/twitter.png 查看文件


二进制
dist/assets/imgs/footer/youtube.png 查看文件


二进制
dist/assets/imgs/productoverview/productbg.png 查看文件


+ 139
- 118
index.html 查看文件 

@@ -15,41 +15,43 @@
15 15 
 </head>
16 16
17 17 
 <body>
18 
-     <!-- main-body -->
19 
-    <main class="home-main-container">
18 
+     <!-- navbar -->
19 
+     <div id="navbar-head"></div>
20 
+     <!-- end-navbar -->
21 
+    <!-- main-body -->
22 
+    <main class="main-body home-main-container">
20 23 
         <section class="hero-banner">
21 
-            <header>
22 
-                <!-- navbar -->
23 
-                <div id="navbar-head"></div>
24 
-                <!-- end-navbar -->
25 
-            </header>
26 
-            <hr class="mx-5">
24 
+
25 
+
26 
+
27 27 
             <!-- banner-start -->
28 28 
             <div class="container">
29 29 
                 <section class="banner-wrapper ">
30 
-                    <div class="banner-main-container">
31 
-                        <div class="col-md-6 mt-7">
30 
+                    <div class="banner-main-container d-flex align-items-center">
31 
+                        <div class="col-md-6">
32 32 
                             <h5 class="mb-4">AIO24 - 1700N</h5>
33 33 
                             <h1 class="banner_heading_4 mb-4">All-in-One</h1>
34 34 
                             <h6 class="subtitle_1 mb-4">Extraordinary Performance and Unparalleled Flexibility</h6>
35 35 
                             <a class="btn btn-dark button_dark" href="#">Know
36 
-                                    More</a>
36 
+                                More</a>
37 37 
                         </div>
38 38 
                         <div class="col-md-12 d-block d-sm-none">
39 
-                            <img src="./dist/assets/imgs/Home/all-in-one-mobile.png" class="img-fluid" alt="mobile-all-in-one">
39 
+                            <img src="./dist/assets/imgs/Home/all-in-one-mobile.png" class="img-fluid mobile-home-img"
40 
+                            alt="mobile-all-in-one">
40 41 
                         </div>
41 42 
                     </div>
42 43 
                 </section>
43 44 
                 <section class="offer-main-sec py-2 mb-3">
44 45 
                     <div class="offer-sec bg-white shadow rounded ms-auto
45 46 
                             col-md-4">
46 
-                        <p class="py-3 text-center satoshi_font">Flat <span class="fw-bold"> 4,500</span> Instant Discount with HDFC Credit Card</p>
47 
+                        <p class="py-3 text-center satoshi_font">Flat <span class="fw-bold"> 4,500</span> Instant
48 
+                            Discount with HDFC Credit Card</p>
47 49 
                     </div>
48 50 
                 </section>
49 51 
                 <div class="col-5 d-block d-sm-none">
50 52 
                     <a class="btn btn-dark button_dark mb-4" href="#">Know
51 53 
                         More</a>
52 
-                    </div>
54 
+                </div>
53 55 
             </div>
54 56 
         </section>
55 57 
         <!-- end-banner -->
 
@@ -58,30 +60,33 @@
58 60 
             <div class="container d-none d-sm-block">
59 61 
                 <div class="row g-0 justify-content-center
60 62 
                         align-items-center px-4 text-center">
61 
-                    <div class="col-md-3 sec-space-3"><img src="./dist/assets/imgs/Home/aw-partner-1.png" class="
62 
-                                img-fluid" alt="partners-img"></div>
63 
-                    <div class="col-md-3 sec-space-3"><img src="./dist/assets/imgs/Home/aw-partner-2.png" class="
64 
-                                img-fluid" alt="partners-img"></div>
65 
-                    <div class="col-md-3 sec-space-3"><img src="./dist/assets/imgs/Home/aw-partner-3.png" class="
66 
-                                img-fluid" alt="partners-img"></div>
67 
-                    <div class="col-md-3 sec-space-3"><img src="./dist/assets/imgs/Home/aw-partner-4.png" class="
68 
-                                img-fluid" alt="partners-img"></div>
69 
-
63 
+                    <div class="col-md-3"><img src="./dist/assets/imgs/Home/aw-partner-1.png" class="
64 
+                                img-fluid partners-img" alt="partners-img"></div>
65 
+                    <div class="col-md-3 ps-3"><img src="./dist/assets/imgs/Home/aw-partner-2.png" class="
66 
+                                img-fluid partners-img" alt="partners-img"></div>
67 
+                    <div class="col-md-3"><img src="./dist/assets/imgs/Home/aw-partner-3.png" class="
68 
+                                img-fluid partners-img" alt="partners-img"></div>
69 
+                    <div class="col-md-3"><img src="./dist/assets/imgs/Home/aw-partner-4.png" class="
70 
+                                img-fluid partners-img" alt="partners-img"></div>
70 71 
                 </div>
71 72 
             </div>
72 73 
             <div class="d-block d-sm-none">
73 74 
                 <div class="d-flex g-0 justify-content-center
74 75 
                         align-items-center text-center">
75 
-                    <div class="col-md-6 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-1.png" class="
76 
+                    <div class="col-md-6 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-1.png"
77 
+                            class="
76 78 
                                 img-fluid" alt="partners-img"></div>
77 
-                    <div class="col-md-6 ms-5 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-2.png" class="
79 
+                    <div class="col-md-6 ms-5 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-2.png"
80 
+                            class="
78 81 
                                 img-fluid" alt="partners-img"></div>
79 82 
                 </div>
80 83 
                 <div class="d-flex g-0 justify-content-center
81 84 
                         align-items-center text-center">
82 
-                    <div class="col-md-6 sec-space-3 windows-icon-mb"><img src="./dist/assets/imgs/Home/moobile-partner-img-3.png" class="
85 
+                    <div class="col-md-6 sec-space-3 windows-icon-mb"><img
86 
+                            src="./dist/assets/imgs/Home/moobile-partner-img-3.png" class="
83 87 
                                 img-fluid" alt="partners-img"></div>
84 
-                    <div class="col-md-6 ms-5 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-4.png" class="
88 
+                    <div class="col-md-6 ms-5 sec-space-3"><img src="./dist/assets/imgs/Home/moobile-partner-img-4.png"
89 
+                            class="
85 90 
                                 img-fluid" alt="partners-img"></div>
86 91 
                 </div>
87 92 
             </div>
 
@@ -89,24 +94,21 @@
89 94 
         <section class="products-container sec-space-1">
90 95 
             <div class="products-main-container">
91 96 
                 <div class="row g-0">
92 
-                    <div class="col-md-6 consumer-prd position-relative"><img class="img-fluid" src="./dist/assets/imgs/Home/consumer-product.png" alt="consumer-product">
97 
+                    <div class="col-md-6 consumer-prd position-relative"><img class="img-fluid"
98 
+                            src="./dist/assets/imgs/Home/consumer-product.png" alt="consumer-product">
93 99 
                         <div class="product-heading position-absolute top-0
94 100 
                                 w-100">
95 101 
                             <div class="d-flex align-items-center m-4">
96 102 
                                 <span class="text-start">
97 
-                                        <h4 class="text-white fw-bold">Consumer
98 
-                                            Product</h4>
99 
-                                    </span>
103 
+                                    <h4 class="text-white fw-bold">Consumer
104 
+                                        Product</h4>
105 
+                                </span>
100 106 
                                 <span class="text-end ms-auto">
101 
-                                        <h5 class="text-white fw-bold"><svg
102 
-                                                xmlns="http://www.w3.org/2000/svg"
103 
-                                                width="45"
104 
-                                                height="45"
105 
-                                                fill="#fff" class="bi
106 
-                                                bi-arrow-right-circle"
107 
-                                                viewBox="0
107 
+                                    <h5 class="text-white fw-bold"><svg xmlns="http://www.w3.org/2000/svg" width="45"
108 
+                                            height="45" fill="#fff" class="bi
109 
+                                                bi-arrow-right-circle" viewBox="0
108 110 
                                                 0 16 16">
109 
-                                                <path fill-rule="evenodd" d="M1
111 
+                                            <path fill-rule="evenodd" d="M1
110 112 
                                                     8a7 7 0 1 0 14 0A7 7 0 0
111 113 
                                                     0 1 8zm15 0A8 8 0 1 1 0 8a8
112 114 
                                                     8 0 0 1 16 0zM4.5 7.5a.5.5
 
@@ -114,32 +116,28 @@
114 116 
                                                     2.146a.5.5 0 0 0
115 117 
                                                     .708.708l3-3a.5.5 0 0 0
116 118 
                                                     0-.708l-3-3a.5.5 0 1
117 
-                                                    0-.708.708L10.293 7.5H4.5z"
118 
-                                                    />
119 
-                                                </svg></h5>
120 
-                                        </span>
119 
+                                                    0-.708.708L10.293 7.5H4.5z" />
120 
+                                        </svg></h5>
121 
+                                </span>
121 122 
                             </div>
122 123 
                         </div>
123 124 
                     </div>
124 125 
                     <div class="col-md-6 enterprise-prd
125 
-                                position-relative"><img src="./dist/assets/imgs/Home/enterprise-product.png" alt="enterprise-product" class="img-fluid">
126 
+                                position-relative"><img src="./dist/assets/imgs/Home/enterprise-product.png"
127 
+                            alt="enterprise-product" class="img-fluid">
126 128 
                         <div class="product-heading position-absolute
127 129 
                                     bottom-0 w-100">
128 130 
                             <div class="d-flex align-items-center m-4">
129 131 
                                 <span class="text-start">
130 
-                                            <h4 class="text-white fw-bold">Enterprise
131 
-                                                Product</h4>
132 
-                                        </span>
132 
+                                    <h4 class="text-white fw-bold">Enterprise
133 
+                                        Product</h4>
134 
+                                </span>
133 135 
                                 <span class="text-end ms-auto">
134 
-                                            <h5 class="text-white
135 
-                                                fw-bold"><svg
136 
-                                                    xmlns="http://www.w3.org/2000/svg"
137 
-                                                    width="45" height="45"
138 
-                                                    fill="#fff" class="bi
139 
-                                                    bi-arrow-right-circle"
140 
-                                                    viewBox="0 0 16 16">
141 
-                                                    <path fill-rule="evenodd"
142 
-                                                        d="M1 8a7 7 0 1 0 14 0A7
136 
+                                    <h5 class="text-white
137 
+                                                fw-bold"><svg xmlns="http://www.w3.org/2000/svg" width="45" height="45"
138 
+                                            fill="#fff" class="bi
139 
+                                                    bi-arrow-right-circle" viewBox="0 0 16 16">
140 
+                                            <path fill-rule="evenodd" d="M1 8a7 7 0 1 0 14 0A7
143 141 
                                                         7 0
144 142 
                                                         0
145 143 
                                                         0 1 8zm15 0A8 8 0 1 1 0
 
@@ -151,18 +149,18 @@
151 149 
                                                         0-.708l-3-3a.5.5 0 1
152 150 
                                                         0-.708.708L10.293
153 151 
                                                         7.5H4.5z" />
154 
-                                                    </svg></h5>
155 
-                                            </span>
152 
+                                        </svg></h5>
153 
+                                </span>
156 154 
                             </div>
157 155 
                         </div>
158 156 
                     </div>
159 157 
                 </div>
160 158 
             </div>
161 
-            </div>
159 
+            <!-- </div> -->
162 160 
         </section>
163 161 
         <!-- end-partners -->
164 162 
         <!-- features -->
165 
-        <section class="main-features-container sec-space-1">
163 
+        <section class="main-features-container d-none d-lg-block  sec-space-1">
166 164 
             <div class="main-features-heading">
167 165 
                 <div class="container ">
168 166 
                     <div class="justify-content-between
 
@@ -172,15 +170,17 @@
172 170 
                             <h1> <span class="fw-bold"> Presenting</span></h1>
173 171 
                         </div>
174 172 
                         <div class="col-md-6">
175 
-                            <h5 class="satoshi_font fw-normal">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Blanditiis repudiandae eos inventore necessitatibus rem nostrum placeat fugit repellat. Similique provident reprehenderit quas cupiditate.</h5>
173 
+                            <h5 class="satoshi_font fw-normal">Lorem ipsum dolor sit, amet consectetur adipisicing elit.
174 
+                                Blanditiis repudiandae eos inventore necessitatibus rem nostrum placeat fugit repellat.
175 
+                                Similique provident reprehenderit quas cupiditate.</h5>
176 176 
                         </div>
177 177 
                     </div>
178 178 
                     <div class="aw-main-features sec-space-1">
179 179 
                         <div class=" d-block d-sm-flex
180 
-                                    justify-content-around">
181 
-                            <div class="aw-main-features-toggle">
180 
+                        justify-content-between" style="height:520px">
181 
+                            <div class="aw-main-features-toggle d-flex">
182 182 
                                 <div class="aw-main-features-toggler-tab
183 
-                                            d-none">
183 
+                                p-4">
184 184 
                                     <div class="feature-sno">
185 185 
                                         <h3 class="border-bottom
186 186 
                                                     border-dark
 
@@ -189,15 +189,15 @@
189 189 
                                         </h3>
190 190 
                                     </div>
191 191 
                                     <div class="aw-feature-name
192 
-                                                satoshi_font">
192 
+                                                satoshi_font  ">
193 193 
                                         <h5 class="satoshi_font">Advanced Cooling
194 194 
                                         </h5>
195 195 
                                     </div>
196 196 
                                 </div>
197 197
198 198 
                                 <div class="feature-bg-image
199 
-                                            position-relative me-3" style="max-width: 30rem;">
200 
-                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100" />
199 
+                                            position-relative" style="max-width: 50rem;">
200 
+                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100 h-100" />
201 201 
                                     <div class="position-absolute
202 202 
                                                 bottom-0 text-light w-100">
203 203 
                                         <p class="p-2 m-0">01.</p>
 
@@ -210,12 +210,12 @@
210 210 
                                             <button type="button" class="btn
211 211 
                                                         btn-primary
212 212 
                                                         rounded-0 satoshi_font">Learn
213 
-                                                        More</button>
213 
+                                                More</button>
214 214 
                                         </div>
215 215 
                                     </div>
216 216 
                                 </div>
217 217 
                             </div>
218 
-                            <div class="bg-light p-3
218 
+                            <div class="bg-light p-4
219 219 
                                         aw-main-features-toggle">
220 220 
                                 <div class="aw-main-features-toggler-tab">
221 221 
                                     <div class="feature-sno">
 
@@ -233,8 +233,8 @@
233 233 
                                 </div>
234 234
235 235 
                                 <div class="feature-bg-image
236 
-                                            position-relative me-3 d-none" style="max-width: 30rem;">
237 
-                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100" />
236 
+                                            position-relative  d-none" style="max-width: 50rem;">
237 
+                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100 h-100" />
238 238 
                                     <div class="position-absolute
239 239 
                                                 bottom-0 text-light w-100">
240 240 
                                         <p class="p-2 m-0">02.</p>
 
@@ -247,12 +247,12 @@
247 247 
                                             <button type="button" class="btn
248 248 
                                                         btn-primary
249 249 
                                                         rounded-0 satoshi_font">Learn
250 
-                                                        More</button>
250 
+                                                More</button>
251 251 
                                         </div>
252 252 
                                     </div>
253 253 
                                 </div>
254 254 
                             </div>
255 
-                            <div class="bg-light p-3
255 
+                            <div class="bg-light p-4
256 256 
                                         aw-main-features-toggle">
257 257 
                                 <div class="aw-main-features-toggler-tab">
258 258 
                                     <div class="feature-sno">
 
@@ -270,8 +270,8 @@
270 270 
                                 </div>
271 271
272 272 
                                 <div class="feature-bg-image
273 
-                                            position-relative me-3 d-none" style="max-width: 30rem;">
274 
-                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100" />
273 
+                                            position-relative  d-none" style="max-width: 50rem;">
274 
+                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100 h-100" />
275 275 
                                     <div class="position-absolute
276 276 
                                                 bottom-0 text-light w-100">
277 277 
                                         <p class="p-2 m-0">03.</p>
 
@@ -284,12 +284,12 @@
284 284 
                                             <button type="button" class="btn
285 285 
                                                         btn-primary
286 286 
                                                         rounded-0 satoshi_font">Learn
287 
-                                                        More</button>
287 
+                                                More</button>
288 288 
                                         </div>
289 289 
                                     </div>
290 290 
                                 </div>
291 291 
                             </div>
292 
-                            <div class="bg-light p-3
292 
+                            <div class="bg-light p-4
293 293 
                                         aw-main-features-toggle">
294 294 
                                 <div class="aw-main-features-toggler-tab">
295 295 
                                     <div class="feature-sno">
 
@@ -307,8 +307,8 @@
307 307 
                                 </div>
308 308
309 309 
                                 <div class="feature-bg-image
310 
-                                            position-relative me-3 d-none" style="max-width: 30rem;">
311 
-                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100" />
310 
+                                            position-relative  d-none" style="max-width: 50rem;">
311 
+                                    <img src="https://mdbcdn.b-cdn.net/img/new/standard/city/053.webp" class="w-100 h-100" />
312 312 
                                     <div class="position-absolute
313 313 
                                                 bottom-0 text-light w-100">
314 314 
                                         <p class="p-2 m-0">04.</p>
 
@@ -321,7 +321,7 @@
321 321 
                                             <button type="button" class="btn
322 322 
                                                         btn-primary
323 323 
                                                         rounded-0 satoshi_font">Learn
324 
-                                                        More</button>
324 
+                                                More</button>
325 325 
                                         </div>
326 326 
                                     </div>
327 327 
                                 </div>
 
@@ -381,34 +381,40 @@
381 381 
                             sec-space-2">
382 382 
                     <div class="col">
383 383 
                         <div class="card h-100 border-0">
384 
-                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25" alt="different-img-1">
384 
+                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25"
385 
+                                alt="different-img-1">
385 386 
                             <div class="card-body">
386 387 
                                 <h5 class="card-title text-center">Solution Focus
387 388 
                                 </h5>
388 389 
                                 <p class="card-text text-center
389 
-                                            satoshi_font">This card has supporting text below as a natural lead-in to additional content.
390 
+                                            satoshi_font">This card has supporting text below as a natural lead-in to
391 
+                                    additional content.
390 392 
                                 </p>
391 393 
                             </div>
392 394 
                         </div>
393 395 
                     </div>
394 396 
                     <div class="col">
395 397 
                         <div class="card h-100 border-0">
396 
-                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25" alt="different-img-2">
398 
+                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25"
399 
+                                alt="different-img-2">
397 400 
                             <div class="card-body">
398 401 
                                 <h5 class="card-title text-center">Our People & Culture</h5>
399 402 
                                 <p class="card-text text-center
400 
-                                            satoshi_font">This card has supporting text below as a natural lead-in to additional content.
403 
+                                            satoshi_font">This card has supporting text below as a natural lead-in to
404 
+                                    additional content.
401 405 
                                 </p>
402 406 
                             </div>
403 407 
                         </div>
404 408 
                     </div>
405 409 
                     <div class="col">
406 410 
                         <div class="card h-100 border-0">
407 
-                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25" alt="different-img-3">
411 
+                            <img src="./dist/assets/imgs/Home/dark-circle.png" class="img-fluid mx-auto w-25"
412 
+                                alt="different-img-3">
408 413 
                             <div class="card-body">
409 414 
                                 <h5 class="card-title text-center">Design Lead Approch</h5>
410 415 
                                 <p class="card-text text-center
411 
-                                            satoshi_font">This card has supporting text below as a natural lead-in to additional content.
416 
+                                            satoshi_font">This card has supporting text below as a natural lead-in to
417 
+                                    additional content.
412 418 
                                 </p>
413 419 
                             </div>
414 420 
                         </div>
 
@@ -427,15 +433,17 @@
427 433 
                             <div class="card-body text-white mb-5">
428 434 
                                 <h1 class="card-title fw-700 ">Out of World
429 435 
                                 </h1>
430 
-                                <p class="card-text satoshi_font">Anwi Systems excels the performance with open hardware enabling customers to use memory and storage of their choices.
436 
+                                <p class="card-text satoshi_font">Anwi Systems excels the performance with open hardware
437 
+                                    enabling customers to use memory and storage of their choices.
431 438 
                                 </p>
432 439 
                                 <a class="btn btn-light button_dark
433 440 
                                             satoshi_font fw-600" href="#">Learn
434 
-                                            More</a>
441 
+                                    More</a>
435 442 
                             </div>
436 443 
                         </div>
437 444 
                         <div class="col-md-6 ms-auto">
438 
-                            <img src="./dist/assets/imgs/Home/out-of-world.png" class="img-fluid rounded-start" alt="...">
445 
+                            <img src="./dist/assets/imgs/Home/out-of-world.png" class="img-fluid rounded-start"
446 
+                                alt="...">
439 447 
                         </div>
440 448 
                     </div>
441 449 
                 </div>
 
@@ -455,10 +463,10 @@
455 463 
                                 <p class="fw-bold"> Hassel-free Replacement
456 464 
                                 </p>
457 465 
                                 <small class="satoshi_font">10-day
458 
-                                            easy
459 
-                                            replacement policy
460 
-                                            on
461 
-                                            anwisystems.com</small>
466 
+                                    easy
467 
+                                    replacement policy
468 
+                                    on
469 
+                                    anwisystems.com</small>
462 470 
                             </div>
463 471 
                         </div>
464 472 
                         <div class="col-md-4 my-4 border-dark
 
@@ -468,10 +476,10 @@
468 476 
                                 <p class="fw-bold"> Hassel-free Replacement
469 477 
                                 </p>
470 478 
                                 <small class="satoshi_font">10-day
471 
-                                            easy
472 
-                                            replacement policy
473 
-                                            on
474 
-                                            anwisystems.com</small>
479 
+                                    easy
480 
+                                    replacement policy
481 
+                                    on
482 
+                                    anwisystems.com</small>
475 483 
                             </div>
476 484 
                         </div>
477 485 
                         <div class="col-md-4 my-4">
 
@@ -479,9 +487,9 @@
479 487 
                                 <p class="fw-bold">100 % Secure Payments
480 488 
                                 </p>
481 489 
                                 <small class="satoshi_font">we
482 
-                                            support
483 
-                                            cards, Wallets, EMI
484 
-                                            and Cash on Deliver</small>
490 
+                                    support
491 
+                                    cards, Wallets, EMI
492 
+                                    and Cash on Deliver</small>
485 493 
                             </div>
486 494 
                         </div>
487 495 
                     </div>
 
@@ -507,13 +515,12 @@
507 515 
                                                             news-letter-email
508 516 
                                                             text-white
509 517 
                                                             border-0" placeholder="Email
510 
-                                                            Address" /> <svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="#fff" class="bi
518 
+                                                            Address" /> <svg xmlns="http://www.w3.org/2000/svg"
519 
+                                                    width="25" height="25" fill="#fff" class="bi
511 520 
                                                             bi-arrow-right
512 521 
                                                             me-3" viewBox="0
513 522 
                                                             0 16 16">
514 
-                                                            <path
515 
-                                                                fill-rule="evenodd"
516 
-                                                                d="M1 8a.5.5
523 
+                                                    <path fill-rule="evenodd" d="M1 8a.5.5
517 524 
                                                                 0 0
518 525 
                                                                 1
519 526 
                                                                 .5-.5h11.793l-3.147-3.146a.5.5
 
@@ -527,8 +534,8 @@
527 534 
                                                                 1-.708-.708L13.293
528 535 
                                                                 8.5H1.5A.5.5
529 536 
                                                                 0 0
530 
-                                                                1 1 8z"/>
531 
-                                                            </svg></a>
537 
+                                                                1 1 8z" />
538 
+                                                </svg></a>
532 539 
                                         </div>
533 540 
                                     </div>
534 541 
                                 </div>
 
@@ -549,13 +556,17 @@
549 556 
     <script src="./dist/Js/jquery.min.js"></script>
550 557 
     <script src="./libs/Owlcarousel/Js/owl.carousel.min.js"></script>
551 558 
     <script src="./dist/Js/navbar.js"></script>
552 
-    <script src="./dist/Js/footer.js"></script>
559 
+    <script src="./dist/Js/footer.js"></script>
553 560 
     <script>
554 561 
         $('.owl-carousel.star-products-img-sec').owlCarousel({
555 
-            loop: true,
562 
+            // loop: true,
556 563 
             margin: 10,
564 
+            rtl:false,
557 565 
             nav: true,
558 
-            navText: ["<svg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='#B8B8B8' class='bi bi-arrow-left-short' viewBox='0 0 16 16'> <path fill-rule='evenodd' d='M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z'/></svg>", "<svg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='#B8B8B8' class='bi bi-arrow-right-short' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/> </svg>"],
566 
+            navText: [
567 
+                "<svg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='#B8B8B8' class='bi bi-arrow-left-short' viewBox='0 0 16 16'> <path fill-rule='evenodd' d='M12 8a.5.5 0 0 1-.5.5H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5a.5.5 0 0 1 .5.5z'/></svg>",
568 
+                "<svg xmlns='http://www.w3.org/2000/svg' width='35' height='35' fill='#B8B8B8' class='bi bi-arrow-right-short' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z'/> </svg>"
569 
+            ],
559 570 
             responsive: {
560 571 
                 0: {
561 572 
                     items: 1
 
@@ -567,24 +578,34 @@
567 578 
                     items: 5
568 579 
                 }
569 580 
             }
570 
-        })
571 
-        $(".aw-main-features-toggle").click(function() {
581 
+        });
582 
+        $('.owl-nav,.owl-dots').wrapAll('<div class="d-flex flex-row-reverse justify-content-between align-items-center"></div>')
583 
+        $(".aw-main-features-toggle").click(function () {
572 584 
             $('.feature-bg-image').addClass('d-none');
573 
-            $(".aw-main-features-toggle").addClass('p-3 bg-light')
585 
+            $(".aw-main-features-toggle").addClass('p-4 bg-light')
574 586 
             $('.aw-main-features-toggler-tab').removeClass('d-none');
587 
+         //   $('.aw-main-features-toggler-tab.p-4').removeClass('p-4');
575 588 
             let toggleTab = $(this).find('.feature-bg-image:visible').length
576 589 
             if (toggleTab) {
577 
-                $(this).find('.feature-bg-image').addClass('d-none');
590 
+              //  $(this).find('.feature-bg-image').addClass('d-none');
578 591 
                 $(this).find('.feature-bg-image').animate({
579 592 
                     width: "toggle"
580 593 
                 }, 500);
581 594 
             } else {
582 
-                $(this).find('.aw-main-features-toggler-tab').addClass('d-none');
583 
-                $(this).find('.feature-bg-image').removeClass('d-none')
584 
-                $(this).find('.feature-bg-image').show();
595 
+               // $(this).find('.aw-main-features-toggler-tab').addClass('d-none');
596 
+
597 
+              $('.aw-main-features-toggle.d-flex').removeClass('p-4')
598 
+
599 
+               $(this).addClass('d-flex');
600 
+
601 
+                $(this).find('.aw-main-features-toggler-tab').addClass('p-4');
602 
+
603 
+               debugger;
604 
+                $(this).find('.feature-bg-image').removeClass('d-none').addClass('animated-feature-img');
605 
+
585 606 
                 if (window.width > 768) {
586 607 
                     $(this).find('.feature-bg-image').animate({
587 
-                        width: "30rem"
608 
+                        width: "50rem"
588 609 
                     }, 500);
589 610 
                 } else {
590 611 
                     $(this).find('.feature-bg-image').animate({
 
@@ -592,7 +613,7 @@
592 613 
                     }, 500);
593 614
594 615 
                 }
595 
-                $(this).removeClass('p-3 bg-light')
616 
+                $(this).removeClass('p-4 bg-light')
596 617 
             }
597 618 
         });
598 619 
     </script>

+ 944
- 921
laptopmulti.html
文件差异内容过多而无法显示
查看文件


+ 5
- 7
shopping-cart.html 查看文件 

@@ -15,15 +15,13 @@
15 15 
 </head>
16 16
17 17 
 <body>
18 
+      <!-- navbar -->
19 
+      <div id="navbar-head" class="bg-white"></div>
20 
+      <!-- end-navbar -->
21 
+  <hr class="mx-5">
18 22 
     <!-- main-body -->
19 
-    <main class="shopping-cart-main-container">
23 
+    <main class="shopping-cart-main-container main-body">
20 24 
         <section class="bg-white">
21 
-            <header>
22 
-                <!-- navbar -->
23 
-                <div id="navbar-head" class="bg-white"></div>
24 
-                <!-- end-navbar -->
25 
-            </header>
26 
-            <hr class="mx-5">
27 25 
             <div class="cart-sec-highlighter d-none d-sm-block">
28 26 
                 <div class="container">
29 27 
                     <div class="row align-items-center py-4 justify-content-around">

+ 5
- 1
styles/base/_utilities.scss 查看文件 

@@ -115,7 +115,9 @@
115 115 
 .padding_top_10 {
116 116 
   padding-top: 10rem; }
117 117
118 
-
118 
+.padding_top_13{
119 
+  padding-top: 13rem;
120 
+}
119 121 
 // heights
120 122
121 123 
 .h-10{
 
@@ -220,6 +222,8 @@
220 222
221 223
222 224 
 // spacing
225 
+
226 
+
223 227 
 .sec-space-1 {
224 228 
   margin-top: 80px;
225 229 
 }

+ 70
- 13
styles/pages/_home.scss 查看文件 

@@ -28,7 +28,7 @@
28 28 
     background-position-y: -100px;
29 29 
     // home-banner
30 30 
     .banner-main-container {
31 
-        height: 400px;
31 
+        height: 620px;
32 32 
     }
33 33 
 }
34 34 
 
@@ -118,7 +118,7 @@
118 118 
     }
119 119 
 }
120 120
121 
-@media (min-width:298px) and (max-width:768px) {
121 
+@media (min-width:278px) and (max-width:767px) {
122 122 
     .home-main-container {
123 123 
         h5,
124 124 
         h6 {
 
@@ -129,18 +129,23 @@
129 129 
             margin-top: 40px;
130 130 
         }
131 131 
         .banner-main-container {
132 
-                height: 550px;
133 
-            text-align: center;
134 
-            .col-md-6 {
135 
-                margin-top: 0px;
136 
-                .button_dark{
137 
-                    display: none;
138 
-                }
139 
-            }
140 
-            h1 {
141 
-                font-size: 2rem;
132 
+            height: 550px;
133 
+            display: block !important;
134 
+        text-align: center;
135 
+        .col-md-6 {
136 
+            padding-top: 7rem;
137 
+
138 
+            .button_dark{
139 
+                display: none;
142 140 
             }
143 141 
         }
142 
+        .mobile-home-img{
143 
+            width: 85%;
144 
+        }
145 
+        h1 {
146 
+            font-size: 2rem;
147 
+        }
148 
+    }
144 149 
         .hero-banner {
145 150 
             // background: url(../../dist/assets/imgs/Home/All-in-one.png);
146 151 
             // background-size: cover;
 
@@ -165,10 +170,12 @@
165 170 
             writing-mode: horizontal-tb;
166 171 
         }
167 172 
         .products-main-container {
168 
-            .enterprise-prd {
173 
+            .enterprise-prd,.consumer-prd {
169 174 
                 margin-top: 10px;
170 175 
             }
176 
+
171 177 
         }
178 
+
172 179 
         .news-letter-sec {
173 180 
             a.button_dark {
174 181 
                 padding: 10px 5px;
 
@@ -217,4 +224,54 @@
217 224 
             background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
218 225 
         }
219 226 
     }
227 
+}
228 
+
229 
+// index styles
230 
+
231 
+.feature-bg-image.animated-feature-img {
232 
+
233 
+    animation: slide 1s ease .2s forwards;
234 
+    opacity: 0;
235 
+    // transform-origin: left top;
236 
+}
237 
+
238 
+@keyframes slide {
239 
+    from {
240 
+
241 
+        opacity: 0;
242 
+    }
243 
+
244 
+    to {
245 
+
246 
+        opacity: 1;
247 
+    }
248 
+}
249 
+
250 
+[alt=footer-rocket-img]{
251 
+    cursor: pointer;
252 
+}
253 
+.partners-img{
254 
+    height:60px;
255 
+}
256 
+@media (min-width:405px) and (max-width:570px) {
257 
+    .home-main-container .banner-main-container .mobile-home-img{
258 
+        width: 60%;
259 
+    }
260 
+}
261 
+
262 
+@media (min-width:1800px) {
263 
+    .banner-wrapper {
264 
+        position: relative;
265 
+    }
266 
+    .banner-main-container {
267 
+        height: 900px !important;
268 
+    }
269 
+
270 
+    .offer-main-sec{
271 
+        position: absolute;
272 
+    bottom: 40%;
273 
+    right: 20%;
274 
+    width: 60%;
275 
+    }
276 
+
220 277 
 }

+ 73
- 4
styles/style.css 查看文件 

@@ -135,6 +135,10 @@ body {
135 135 
   padding-top: 10rem;
136 136 
 }
137 137
138 
+.padding_top_13 {
139 
+  padding-top: 13rem;
140 
+}
141 
+
138 142 
 .h-10 {
139 143 
   height: 10%;
140 144 
 }
 
@@ -1356,7 +1360,7 @@ body {
1356 1360 
   background-position-y: -100px;
1357 1361 
 }
1358 1362 
 .hero-banner .banner-main-container {
1359 
-  height: 400px;
1363 
+  height: 620px;
1360 1364 
 }
1361 1365
1362 1366 
 .home-main-container .offer-main-sec .offer-sec {
 
@@ -1436,7 +1440,7 @@ body {
1436 1440 
     padding: 10px 5px;
1437 1441 
   }
1438 1442 
 }
1439 
-@media (min-width: 298px) and (max-width: 768px) {
1443 
+@media (min-width: 278px) and (max-width: 767px) {
1440 1444 
   .home-main-container h5,
1441 1445 
 .home-main-container h6 {
1442 1446 
     font-size: 1rem;
 
@@ -1447,14 +1451,18 @@ body {
1447 1451 
   }
1448 1452 
   .home-main-container .banner-main-container {
1449 1453 
     height: 550px;
1454 
+    display: block !important;
1450 1455 
     text-align: center;
1451 1456 
   }
1452 1457 
   .home-main-container .banner-main-container .col-md-6 {
1453 
-    margin-top: 0px;
1458 
+    padding-top: 7rem;
1454 1459 
   }
1455 1460 
   .home-main-container .banner-main-container .col-md-6 .button_dark {
1456 1461 
     display: none;
1457 1462 
   }
1463 
+  .home-main-container .banner-main-container .mobile-home-img {
1464 
+    width: 85%;
1465 
+  }
1458 1466 
   .home-main-container .banner-main-container h1 {
1459 1467 
     font-size: 2rem;
1460 1468 
   }
 
@@ -1472,7 +1480,7 @@ body {
1472 1480 
     -ms-writing-mode: lr-tb;
1473 1481 
         writing-mode: horizontal-tb;
1474 1482 
   }
1475 
-  .home-main-container .products-main-container .enterprise-prd {
1483 
+  .home-main-container .products-main-container .enterprise-prd, .home-main-container .products-main-container .consumer-prd {
1476 1484 
     margin-top: 10px;
1477 1485 
   }
1478 1486 
   .home-main-container .news-letter-sec a.button_dark {
 
@@ -1513,6 +1521,56 @@ body {
1513 1521 
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
1514 1522 
   }
1515 1523 
 }
1524 
+.feature-bg-image.animated-feature-img {
1525 
+  -webkit-animation: slide 1s ease 0.2s forwards;
1526 
+          animation: slide 1s ease 0.2s forwards;
1527 
+  opacity: 0;
1528 
+}
1529 
+
1530 
+@-webkit-keyframes slide {
1531 
+  from {
1532 
+    opacity: 0;
1533 
+  }
1534 
+  to {
1535 
+    opacity: 1;
1536 
+  }
1537 
+}
1538 
+
1539 
+@keyframes slide {
1540 
+  from {
1541 
+    opacity: 0;
1542 
+  }
1543 
+  to {
1544 
+    opacity: 1;
1545 
+  }
1546 
+}
1547 
+[alt=footer-rocket-img] {
1548 
+  cursor: pointer;
1549 
+}
1550 
+
1551 
+.partners-img {
1552 
+  height: 60px;
1553 
+}
1554 
+
1555 
+@media (min-width: 405px) and (max-width: 570px) {
1556 
+  .home-main-container .banner-main-container .mobile-home-img {
1557 
+    width: 60%;
1558 
+  }
1559 
+}
1560 
+@media (min-width: 1800px) {
1561 
+  .banner-wrapper {
1562 
+    position: relative;
1563 
+  }
1564 
+  .banner-main-container {
1565 
+    height: 900px !important;
1566 
+  }
1567 
+  .offer-main-sec {
1568 
+    position: absolute;
1569 
+    bottom: 40%;
1570 
+    right: 20%;
1571 
+    width: 60%;
1572 
+  }
1573 
+}
1516 1574 
 .shopping-cart-main-container {
1517 1575 
   background-color: #F5FFEA;
1518 1576 
   padding-bottom: 50px;
 
@@ -1953,6 +2011,13 @@ body {
1953 2011 
   border-radius: 10px;
1954 2012 
 }
1955 2013
2014 
+#navbar-head {
2015 
+  position: fixed;
2016 
+  width: 100%;
2017 
+  z-index: 9999;
2018 
+  top: 0;
2019 
+}
2020 
+
1956 2021 
 .biz-nav-wrapper .navbar-brand img {
1957 2022 
   width: 150px;
1958 2023 
 }
 
@@ -1988,4 +2053,8 @@ body {
1988 2053 
 .footer-wrapper .footer-sub-content p {
1989 2054 
   line-height: 2rem;
1990 2055 
   font-family: "Satoshi", sans-serif;
2056 
+}
2057 
+
2058 
+.footer-socailImg {
2059 
+  width: 30px;
1991 2060 
 }/*# sourceMappingURL=style.css.map */

+ 1
- 1
styles/style.css.map
文件差异内容过多而无法显示
查看文件


+ 18
- 0
styles/style.scss 查看文件 

@@ -20,6 +20,7 @@
20 20 
 @import "pages/productOverview/osPlusSoftware";
21 21 
 @import "pages/productOverview/controlPanel";
22 22
23 
+
23 24 
 @import "pages/home";
24 25 
 @import "pages/shopping-cart";
25 26 
 @import "pages/allInOne";
 
@@ -120,6 +121,7 @@ body {
120 121 
     overflow-x: hidden;
121 122 
 }
122 123
124 
+
123 125 
 @media only screen and (max-width: 56.25em) {
124 126 
     body {
125 127 
         padding: 0;
 
@@ -153,6 +155,12 @@ body {
153 155 
 }
154 156
155 157 
 // navbar
158 
+#navbar-head{
159 
+    position: fixed;
160 
+    width: 100%;
161 
+    z-index: 9999;
162 
+    top: 0;
163 
+}
156 164 
 .biz-nav-wrapper {
157 165 
     .navbar-brand img {
158 166 
         width: 150px;
 
@@ -171,26 +179,36 @@ body {
171 179 
     // background-color: rgb(0, 0, 0);
172 180 
     background-image: url(../dist/assets/imgs/Home/Footer-bg-1.png);
173 181 
     background-size: cover;
182 
+
174 183 
     .footer-content-main-container {
175 184 
         background-image: url(../dist/assets/imgs/Home/Footer-pattern.png);
176 185 
         background-size: contain;
177 186 
         background-position: right 30px;
178 187 
         background-repeat: no-repeat;
179 188 
     }
189 
+
180 190 
     .last-col-footer {
181 191 
         width: 23%;
182 192 
     }
193 
+
183 194 
     @media (min-width:1990px) {
184 195 
         .footer-rkt {
185 196 
             right: 45px !important;
186 197 
         }
187 198 
     }
199 
+
188 200 
     .footer-logo img {
189 201 
         width: 120px;
190 202 
     }
203 
+
191 204 
     li,
192 205 
     .footer-sub-content p {
193 206 
         line-height: 2rem;
194 207 
         font-family: "Satoshi", sans-serif;
195 208 
     }
209 
+}
210 
+
211 
+// footer
212 
+.footer-socailImg{
213 
+    width: 30px;
196 214 
 }

撰写 预览
正在加载...
取消
保存