diff --git a/code_backend_theme/static/description/assets/all_screens.png b/code_backend_theme/static/description/assets/all_screens.png
new file mode 100644
index 000000000..dda177cbe
Binary files /dev/null and b/code_backend_theme/static/description/assets/all_screens.png differ
diff --git a/code_backend_theme/static/description/assets/easily-access-menu.gif b/code_backend_theme/static/description/assets/easily-access-menu.gif
new file mode 100644
index 000000000..08340f307
Binary files /dev/null and b/code_backend_theme/static/description/assets/easily-access-menu.gif differ
diff --git a/code_backend_theme/static/description/assets/hero.png b/code_backend_theme/static/description/assets/hero.png
new file mode 100644
index 000000000..e4415fd01
Binary files /dev/null and b/code_backend_theme/static/description/assets/hero.png differ
diff --git a/code_backend_theme/static/description/assets/menu_focus.png b/code_backend_theme/static/description/assets/menu_focus.png
new file mode 100644
index 000000000..dc7b00c8b
Binary files /dev/null and b/code_backend_theme/static/description/assets/menu_focus.png differ
diff --git a/code_backend_theme/static/description/assets/resp-gif.gif b/code_backend_theme/static/description/assets/resp-gif.gif
new file mode 100644
index 000000000..f6939e09a
Binary files /dev/null and b/code_backend_theme/static/description/assets/resp-gif.gif differ
diff --git a/code_backend_theme/static/description/assets/responsive.jpg b/code_backend_theme/static/description/assets/responsive.jpg
new file mode 100644
index 000000000..06cb4e9a5
Binary files /dev/null and b/code_backend_theme/static/description/assets/responsive.jpg differ
diff --git a/code_backend_theme/static/description/assets/screenshots/10.newlookoftabs.png b/code_backend_theme/static/description/assets/screenshots/10.newlookoftabs.png
new file mode 100644
index 000000000..a365ac470
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/10.newlookoftabs.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/11.recruitment.png b/code_backend_theme/static/description/assets/screenshots/11.recruitment.png
new file mode 100644
index 000000000..cf5f0a453
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/11.recruitment.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/12.saleskanban.png b/code_backend_theme/static/description/assets/screenshots/12.saleskanban.png
new file mode 100644
index 000000000..cd444ffc3
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/12.saleskanban.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/13.modified kanban employee.png b/code_backend_theme/static/description/assets/screenshots/13.modified kanban employee.png
new file mode 100644
index 000000000..3d30005f7
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/13.modified kanban employee.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/15.sidebarwithlistview.png b/code_backend_theme/static/description/assets/screenshots/15.sidebarwithlistview.png
new file mode 100644
index 000000000..a15a09f28
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/15.sidebarwithlistview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/16grapghview.png b/code_backend_theme/static/description/assets/screenshots/16grapghview.png
new file mode 100644
index 000000000..f30cacb89
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/16grapghview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/17.attendanceview.png b/code_backend_theme/static/description/assets/screenshots/17.attendanceview.png
new file mode 100644
index 000000000..93001bcef
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/17.attendanceview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/2.groupbyview.png b/code_backend_theme/static/description/assets/screenshots/2.groupbyview.png
new file mode 100644
index 000000000..babf27bf5
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/2.groupbyview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/3.settings page.png b/code_backend_theme/static/description/assets/screenshots/3.settings page.png
new file mode 100644
index 000000000..ea62e8cde
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/3.settings page.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/4.discusspage.png b/code_backend_theme/static/description/assets/screenshots/4.discusspage.png
new file mode 100644
index 000000000..c81b6bdac
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/4.discusspage.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/5.productskanaban.png b/code_backend_theme/static/description/assets/screenshots/5.productskanaban.png
new file mode 100644
index 000000000..8305b920c
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/5.productskanaban.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/6.purchase view.png b/code_backend_theme/static/description/assets/screenshots/6.purchase view.png
new file mode 100644
index 000000000..140a74fa7
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/6.purchase view.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/7.productviewsmartbuttons.png b/code_backend_theme/static/description/assets/screenshots/7.productviewsmartbuttons.png
new file mode 100644
index 000000000..1f30fcf11
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/7.productviewsmartbuttons.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/8error.png b/code_backend_theme/static/description/assets/screenshots/8error.png
new file mode 100644
index 000000000..447fa0183
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/8error.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/Form view.png b/code_backend_theme/static/description/assets/screenshots/Form view.png
new file mode 100644
index 000000000..456335726
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/Form view.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/kanabangroupview.png b/code_backend_theme/static/description/assets/screenshots/kanabangroupview.png
new file mode 100644
index 000000000..d6f3f0d69
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/kanabangroupview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/listview.png b/code_backend_theme/static/description/assets/screenshots/listview.png
new file mode 100644
index 000000000..a81604571
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/listview.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/login.png b/code_backend_theme/static/description/assets/screenshots/login.png
new file mode 100644
index 000000000..cb6e824f5
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/login.png differ
diff --git a/code_backend_theme/static/description/assets/screenshots/modal.png b/code_backend_theme/static/description/assets/screenshots/modal.png
new file mode 100644
index 000000000..b89e182ca
Binary files /dev/null and b/code_backend_theme/static/description/assets/screenshots/modal.png differ
diff --git a/code_backend_theme/static/description/index.html b/code_backend_theme/static/description/index.html
index 462eb0a4c..1645027e2 100644
--- a/code_backend_theme/static/description/index.html
+++ b/code_backend_theme/static/description/index.html
@@ -1,609 +1,1108 @@
-<div style="background-color: #714B67; min-height: 600px; width: 100%; padding: 15px; position: relative;">
-    <!-- TITLE BAR -->
-    <div
-        style="border-bottom: 1px solid #875A7B; padding: 15px; display: flex; justify-content: space-between; align-items: center;">
-        <img src="assets/misc/cybrosys-logo.png" width="42" height="42" style="width: 42px; height: 42px;" />
-        <div>
-            <div style="color: #7C7BAD; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
-                class="mr-2">
-                <i class="fa fa-check mr-1"></i>Community
-            </div>
-            <div style="color: #875A7B; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
-                class="mr-2">
-                <i class="fa fa-check mr-1"></i>Enterprise
-            </div>
-            <div style="color: #017E84; font-size: 14px; font-family: 'Montserrat', sans-serif; font-weight: bold; background-color: white; display: inline-block; padding: 3px 10px; border-radius: 50px;"
-                class="mr-2">
-                <i class="fa fa-check mr-1"></i>Odoo.sh
-            </div>
+<!-- HERO -->
+<div class="container">
+    <div class="row"
+         style="padding: 4rem 2.5rem 0 !important; background-color: #fff !important;">
+        <div class="col-lg-12 d-flex flex-column align-items-center">
+            <h1 class="text-center text-uppercase"
+                style="font-family: Montserrat, 'sans-serif' !important; font-weight: bolder !important; font-size: 2.5rem !important; color: #212121;">
+                Code Backend Theme <sup>
+            </h1>
+            <p class="my-1 text-center text-uppercase"
+               style="letter-spacing: 4px !important; color: #74788D !important;">
+                Minimalist and Elegant Backend
+                Theme for Odoo 16</p>
+        </div>
+        <div class="col-lg-12 d-flex justify-content-center align-items-center"
+             style="margin: 2rem 0;">
+            <img src="./assets/hero.png" width="100%" height="auto"
+                 class="img-responsive">
         </div>
-    </div>
-    <!-- END OF TITLE BAR -->
-
-    <!-- APP HERO -->
-    <h1 style="color: #FFFFFF; font-weight: bolder; font-size: 50px; text-align: center; margin-top: 50px;">Code Backend Theme</h1>
-    <p style="color:#FFFFFF; padding: 8px 15px; text-align: center; font-size: 24px;">Minimalist and Elegant Backend
-                Theme for Odoo 15.</p>
-    <!-- END OF APP HERO -->
-    <img src="assets/screenshots/code_backend_screenshots.png"
-        style="width: 75%; height: auto; position: absolute; margin-left: auto; margin-right: auto; top: 45%; left: 12%; right: auto;" />
-
-</div>
-
-<!-- NAVIGATION SECTION -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px; margin-top: 300px;">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/compass.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Explore This
-        Module</h2>
-</div>
-<div class="row my-4" style="font-family: 'Montserrat', sans-serif;">
-    <div class="col-sm-12 col-md-6 my-3">
-        <a href="#overview">
-            <div class="d-flex justify-content-between align-items-center"
-                style="background-color: #f5f5f5; padding: 30px; width: 100%;">
-                <div>
-                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Overview</span>
-                    <span
-                        style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">Learn
-                        more about this
-                        module</span>
-                </div>
-                <img src="assets/misc/right-arrow.png" width="36" height="36" />
-            </div>
-        </a>
-    </div>
-    <div class="col-sm-12 col-md-6 my-3">
-        <a href="#features">
-            <div class="d-flex justify-content-between align-items-center"
-                style="background-color: #f5f5f5; padding: 30px; width: 100%;">
-                <div>
-                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Features</span>
-                    <span
-                        style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">View
-                        features of this
-                        module</span>
-                </div>
-                <img src="assets/misc/right-arrow.png" width="36" height="36" />
-            </div>
-        </a>
-    </div>
-    <div class="col-sm-12 col-md-6 my-3">
-        <a href="#screenshots">
-            <div class="d-flex justify-content-between align-items-center"
-                style="background-color: #f5f5f5; padding: 30px; width: 100%;">
-                <div>
-                    <span style="color: #714B67; font-size: 24px; font-weight: 500; display: block;">Screenshots</span>
-                    <span
-                        style="color: #714B67; font-size: 16px; font-weight: 400; color:#282F33;  display: block;">View
-                        screenshots for this
-                        module</span>
-                </div>
-                <img src="assets/misc/right-arrow.png" width="36" height="36" />
-            </div>
-        </a>
     </div>
 </div>
-<!-- END OF NAVIGATION SECTION -->
+<!-- END OF HERO -->
 
-<!-- OVERVIEW SECTION -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;" id="overview">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/pie-chart.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Overview
-    </h2>
-</div>
-<div class="row" style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;">
-    <div class="col-sm-12 py-4">
-        The Code Backend Theme V15 Gives You a Fully Modified View with
+<!-- OVERVIEW -->
+<div class="container">
+    <div class="row"
+         style="padding: 0rem 2.5rem !important; background-color: #fff !important;">
+        <div class="col-lg-12 d-flex flex-column justify-content-center">
+            <p class="my-1 text-center"
+               style="font-family: Montserrat, 'sans-serif' !important; color: #212121 !important;">
+                The Code Backend Theme V16 Gives You a Fully Modified View with
                 a Full Screen Display.
-                This is a Minimalist and Elegant Backend Theme for Odoo 15.
+                This is a Minimalist and Elegant Backend Theme for Odoo 16.
                 This Theme Will Change Your Old Experience to a New Experience
                 With Odoo.
                 It is a Perfect Choice for Your Odoo Backend and an Attractive
-                Theme for Your Odoo 15.
+                Theme for Your Odoo 16.
                 It will Give You a Clean Layout with a New Color Combination and
                 a Modified Font. It has a
                 Sidebar with
                 New App Icons and Company Logo. This Will Change Your Old
                 Kanban, List and Form Views to A Fully
                 Modified View.
+            </p>
+        </div>
+        <div class="col-lg-12 mt-4">
+            <div class="alert alert-warning text-center" role="alert">
+                <i class="fa fa-exclamation-triangle mr-2"
+                   aria-hidden="true"></i>Please make sure that you install
+                all
+                your apps prior to the installation of this theme.
+            </div>
+        </div>
     </div>
 </div>
-<!-- END OF OVERVIEW SECTION -->
-
-<!-- FEATURES SECTION -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;" id="features">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/features.png" />
+<!-- END OF OVERVIEW-->
+<!--DOWNLOAD BUTTON ENTERPRISE-->
+<div>
+    <div class="col-lg-12 text-center mt-5">
+        <a href="https://apps.odoo.com/apps/themes/14.0/code_backend_theme_enterprise/"
+           style="background-color:#556EE6 !important; color:#fff !important; font-weight:600 !important; padding:10px 15px 13px !important; margin:0 5px !important; border-radius:5px !important">
+            <i class="fa fa-download mr-1"></i>Download Code Backend Theme for Enterprise
+        </a>
+        <br/>
     </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Features
-    </h2>
 </div>
-<div class="row" style="font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 14px; line-height: 200%;">
-    <div class="col-sm-12 col-md-6">
-        <div class="d-flex align-items-center" style="margin-top: 40px; margin-bottom: 40px">
-            <img src="assets/misc/check-box.png" class="mr-2" />
-            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Fully Responsive
-                        Layout</span>
-        </div>
-        <div class="d-flex align-items-center" style="margin-top: 30px; margin-bottom: 30px">
-            <img src="assets/misc/check-box.png" class="mr-2" />
-            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">The Code Backend Theme V15 Gives You a Fully Modified Kanban
+
+
+<!-- FEATURE -->
+<div class="container" style="margin-top: 3rem;">
+    <div class="row">
+        <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
+
+            <h2
+                    style="font-weight: 300 !important; background-color: #fff !important; z-index: 1 !important; padding: 0 1rem !important;">
+                Features</h2>
+        </div>
+    </div>
+    <!-- RESPONSIVE -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #556EE6 !important; min-width: 100% !important;">
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/responsive.jpg" width="100%" height="auto"
+                     class="img-responsive">
+            </div>
+            <div class="row">
+                <div class="col-lg-4 d-flex justify-content-center align-items-center"
+                     style="padding: 1.5rem !important; margin: 0rem 0rem 3rem !important;">
+                    <img src="assets/resp-gif.gif" width="80%" height="auto"
+                         class="img-responsive rounded">
+                </div>
+                <div class="col-lg-8" style="padding: 2.5rem 1.5rem!important;">
+                    <div class="text-center"
+                         style="font-size: 0.9rem !important; background-color: #556EE6 !important; padding: 0.5 1.5rem !important; width: 60px; color: #ffffff !important; font-weight: 700; border-radius: 0.2rem !important; margin: 10px 0 !important;">
+                        New
+                    </div>
+                    <h3 style="font-weight: 700 !important;">Fully Responsive
+                        Layout</h3>
+                    <h6
+                            style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                        Now take advantage of everything your dashboard has to
+                        offer even on the go. Our design are
+                        now
+                        fully responsive enabling you to view and manage
+                        everything from the comfort of your mobile
+                        device. Everything
+                        has been designed in a meticulous fashion so that every
+                        view snaps itself to fit the size of
+                        the
+                        device you are using, be it smartphones, tablet or any
+                        other portables, our theme adjusts
+                        itself
+                        to fit the screen size.
+                    </h6>
+                    <span class="d-flex" style="margin-top: 2rem !important;">
+                        <i class="fa fa-check-square mr-2"
+                           style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                        <p>Fully responsive</p>
+                    </span>
+
+                    <span class="d-flex">
+                        <i class="fa fa-check-square mr-2"
+                           style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                        <p>Fly-out hamburger menu on the left</p>
+                    </span>
+
+                    <span class="d-flex">
+                        <i class="fa fa-check-square mr-2"
+                           style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                        <p>Fits perfectly to all screen sizes</p>
+                    </span>
+
+                    <span class="d-flex">
+                        <i class="fa fa-check-square mr-2"
+                           style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                        <p>Quick access menu at the bottom in discuss</p>
+                    </span>
+
+                </div>
+            </div>
+
+        </div>
+    </div>
+    <!-- END OF RESPONSIVE -->
+    <!-- FEATURE -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #556EE6 !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2.5rem 1.5rem!important;">
+                <h3 style="font-weight: 700 !important;">Kanban Group View</h3>
+                <h6
+                        style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                    The Code Backend Theme V16 Gives You a Fully Modified Kanban
                     View and Kanban Group View.
                     The Section Wise Separated Stages give a Pleasant Experience
                     And an Extraordinary Design
                     To Your Content Tiles Making The Tiles Look Great.
                     It will Give You a Clean Layout with the New Color
-                    Combination and a Modified Font</span>
+                    Combination and a Modified Font.
+                </h6>
+                <div class="row mt-4">
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Modified Font</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Color Combination</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Full Screen View</p>
+                        </span>
+                    </div>
+
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Stages are Separated in View</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Clean Layout</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Buttons with New Colors</p>
+                        </span>
+                    </div>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/kanabangroupview.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div class="d-flex align-items-center" style="margin-top: 30px; margin-bottom: 30px">
-            <img src="assets/misc/check-box.png" class="mr-2" />
-            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">The All new Code Backend Theme V15 Gives You The Fully
+    </div>
+    <!-- END OF FEATURE -->
+
+    <!-- FEATURE -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #556EE6 !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2.5rem 1.5rem!important;">
+                <h3 style="font-weight: 700 !important;">List View</h3>
+                <h6
+                        style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                    The All new Code Backend Theme V16 Gives You The Fully
                     Modified List View and This Table Design
                     is Also Have Awesome Design and it Gives You More Beauty for
                     Your Odoo Backend.
                     It will Give You a Clean Layout with the New Color
-                    Combination and a Modified Font.</span>
+                    Combination and a Modified Font.
+                </h6>
+                <div class="row mt-4">
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Modified Table Style</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Color Combination</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Scroll Bar</p>
+                        </span>
+                    </div>
+
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Status Tag</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Scrollbar</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Buttons with New Colors</p>
+                        </span>
+                    </div>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/listview.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div class="d-flex align-items-center" style="margin-top: 30px; margin-bottom: 30px">
-            <img src="assets/misc/check-box.png" class="mr-2" />
-            <span style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Code Backend Theme Gives You The Fully Modified Form View
+    </div>
+    <!-- END OF FEATURE -->
+
+    <!-- FEATURE -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #556EE6 !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2.5rem 1.5rem!important;">
+                <h3 style="font-weight: 700 !important;">Form View</h3>
+                <h6
+                        style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                    Code Backend Theme Gives You The Fully Modified Form View
                     with a Full Screen Experience. It will
                     Give You a Clean Layout with the New Color Combination
-                    and a Modified Font.</span>
+                    and a Modified Font.
+                </h6>
+                <div class="row mt-4">
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Modified Form Style</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Full Screen Form View</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Looks for Tabs</p>
+                        </span>
+                    </div>
+
+                    <div class="col-lg-6">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Style for Required Field</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Chatter Style Under Form View</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Looks for Status Button</p>
+                        </span>
+                    </div>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/Form view.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
     </div>
-</div>
-<!-- END OF FEATURES SECTION -->
+    <!-- END OF FEATURE -->
+
+    <!-- TWO COLUMN BLOCK -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row" style="margin: 2rem; ; min-width: 100% !important;">
+
+            <div class="col-lg-8"
+                 style="padding: 1rem 1rem 1rem 0rem !important;">
+                <div class=" shadow"
+                     style="background-color: #fff !important; border-top:  3px solid #556EE6 !important;  padding: 2.5rem 0rem 0rem 0rem !important;">
+                    <h3 class="mx-4 mt-3" style="font-weight: 700 !important;">
+                        Overview</h3>
+                    <h6 class="mx-4"
+                        style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                        Code Backend Theme V16 is an Attractive Theme for Your
+                        Odoo 16.
+                        This Theme Will Change Improve Your Experience With
+                        Odoo.
+                        This is a Minimalist and Elegant Backend Theme for Odoo
+                        16 And Can Offer a Perfect Choice
+                        for
+                        Your Odoo Backend.
+                    </h6>
+                    <div class="mx-4 my-4">
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Modified Structure for All Type Views</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Style for Active Menus, Radio Buttons and Checkboxes</p>
+                        </span>
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Color Combination</p>
+                        </span>
+
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>New Look for All Applications</p>
+                        </span>
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>A Clean layout and New Font Style</p>
+                        </span>
+                        <span class="d-flex">
+                            <i class="fa fa-check-square mr-2"
+                               style="color:#556EE6 !important; margin-top: 5px !important;"></i>
+                            <p>Sidebar with New Menu Icons</p>
+                        </span>
 
-<!-- SCREENSHOTS SECTION -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;" id="screenshots">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/pictures.png" />
+                    </div>
+                    <img src="./assets/all_screens.png" class="img-responsive"
+                         width="100% !important"
+                         height="auto !important">
+                </div>
+            </div>
+
+            <div class="col-lg-4"
+                 style="padding: 1rem 0rem 1rem 1rem!important;">
+                <div class="shadow"
+                     style="background-color: #fff !important; border-top:  3px solid #556EE6 !important; padding: 2.5rem 0rem 0rem 1.5rem !important; position: relative; overflow: hidden !important;">
+                    <div class="text-center"
+                         style="font-size: 0.9rem !important; background-color: #556EE6 !important; padding: 0.5 1.5rem !important; width: 60px; color: #ffffff !important; font-weight: 700; border-radius: 0.2rem !important; margin: 10px 0 !important;">
+                        New
+                    </div>
+                    <h3 class="mt-3" style="font-weight: 700 !important;">
+                        All-New Menu Design</h3>
+
+                    <h6
+                            style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important; padding-bottom: 3.8rem !important;">
+                        The All-New Menu Design is Main Attractive Section for
+                        the Code Backend Theme. The Sidebar
+                        have New Minimalist
+                        Icons for Applications in Odoo. Also the Sidebar Have
+                        Closing and Opening Option.
+                        Customisable Logo Attached in Sidebar
+                        That is Automatically Fetch Your Company Logo.
+                    </h6>
+                    <img src="./assets/menu_focus.png" class="img-responsive"
+                         width="100% !important"
+                         height="auto !important">
+                </div>
+            </div>
+
+        </div>
     </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Screenshots
-    </h2>
-</div>
-<div class="row">
-    <div class="col-sm-12">
+    <!-- END OF TWO COLUMN BLOCK -->
 
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Login Page</h3>
-            <img src="assets/screenshots/1.png" class="img-thumbnail">
+
+    <!-- FEATURE -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #556EE6 !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2.5rem 1.5rem!important;">
+                <h3 style="font-weight: 700 !important;">Easily Access Sidebar
+                    Menu</h3>
+                <h6
+                        style="font-style: Montserrat, 'sans-serif' !important; color: #2A3042 !important; font-weight: 300 !important;">
+                    Reveal the sidebar menu with just a click. Sidebar menu
+                    features all the relevant links to
+                    navigate
+                    through the application.
+                    Hiding the sidebar leaves more space on the main area
+                    offering a distraction-free view that lets
+                    you
+                    focus on what matters the most.
+                </h6>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/easily-access-menu.gif" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
+    </div>
+    <!-- END OF FEATURE -->
 
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Group By View</h3>
-            <img src="assets/screenshots/2.png" class="img-thumbnail">
+    <!-- SCREENSHOTS -->
+    <div class="container" style="margin-top: 3rem;">
+        <div class="row">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
+
+                <h2
+                        style="font-weight: 300 !important; background-color: #fff !important; z-index: 1 !important; padding: 0 1rem !important;">
+                    Screenshots</h2>
+            </div>
         </div>
 
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Discuss Page</h3>
-            <img src="assets/screenshots/3.png" class="img-thumbnail">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            1</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Login Page</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/login.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Product Kanban View</h3>
-            <img src="assets/screenshots/4.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            2</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Group By View</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/2.groupbyview.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Purchase List View</h3>
-            <img src="assets/screenshots/5.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            3</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Settings Page</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/3.settings page.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Product View with Smart Buttons</h3>
-            <img src="assets/screenshots/6.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            4</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Discuss Page</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/4.discusspage.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Modified Alert Notifications are
-                        Placed on the Right Bottom of Display</h3>
-            <img src="assets/screenshots/7.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            5</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Product Kanban View</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/5.productskanaban.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Wizards and User Error Popups</h3>
-            <img src="assets/screenshots/8.png" class="img-thumbnail">
-            <img src="assets/screenshots/9.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            6</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Purchase List View</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/6.purchase view.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">New Looks for The Tabs</h3>
-            <img src="assets/screenshots/10.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            7</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Product View with Smart Buttons</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/7.productviewsmartbuttons.png"
+                     width="100%" height="auto"
+                     class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Recruitment Kanban View With
-                        Ribbons</h3>
-            <img src="assets/screenshots/11.png" class="img-thumbnail">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            8</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Modified Alert Notifications are
+                        Placed on the Right Bottom of Display
+                    </h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/8error.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
 
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Modified Kanban View for Employees
-                        With New Designed Category Section</h3>
-            <img src="assets/screenshots/12.png" class="img-thumbnail">
-        </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Sidebar with List View</h3>
-            <img src="assets/screenshots/13.png" class="img-thumbnail">
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            9</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">Wizards and User Error Popups</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/modal.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-        <div style="display: block; margin: 30px auto;">
-            <h3 style="font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: bold;">Graphs with Sidebar</h3>
-            <img src="assets/screenshots/14.png" class="img-thumbnail">
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            10</h6>
+                    </div>
+                    <h6 class="mt-2 ml-2">New Looks for The Tabs</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/10.newlookoftabs.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
-    </div>
-</div>
-<!-- END OF SCREENSHOTS SECTION -->
 
-<!-- RELATED PRODUCTS -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/categories.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Related
-        Products
-    </h2>
-</div>
-<div class="row">
-    <div class="col-sm-12">
-        <div id="demo1" class="row carousel slide" data-ride="carousel">
-            <!-- The slideshow -->
-            <div class="carousel-inner" style="padding: 30px;">
-                <div class="carousel-item" style="min-height: 198.656px;">
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/dynamic_accounts_report/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/1.png">
-                            </div>
-                        </a>
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            11</h6>
                     </div>
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/custom_gantt_view/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/2.png">
-                            </div>
-                        </a>
+                    <h6 class="mt-2 ml-2">Recruitment Kanban View With
+                        Ribbons</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/11.recruitment.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
+        </div>
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            12</h6>
                     </div>
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/project_custom_gantt/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/3.png">
-                            </div>
-                        </a>
+                    <h6 class="mt-2 ml-2">Sales Kanban View</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/12.saleskanban.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
+        </div>
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            13</h6>
                     </div>
+                    <h6 class="mt-2 ml-2">Modified Kanban View for Employees
+                        With New Designed Category Section</h6>
                 </div>
-                <div class="carousel-item active" style="min-height: 198.656px;">
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/account_reports_xlsx/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/4.png">
-                            </div>
-                        </a>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/13.modified kanban employee.png"
+                     width="100%" height="auto"
+                     class="img-responsive">
+            </div>
+        </div>
+
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            14</h6>
                     </div>
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/base_accounting_kit/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/5.png">
-                            </div>
-                        </a>
+                    <h6 class="mt-2 ml-2">Sidebar with List View</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/15.sidebarwithlistview.png"
+                     width="100%" height="auto"
+                     class="img-responsive">
+            </div>
+        </div>
+
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            15</h6>
                     </div>
-                    <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        <a href="https://apps.odoo.com/apps/modules/15.0/hr_payroll_community/" target="_blank">
-                            <div style="border-radius:10px">
-                                <img class="img img-responsive center-block" style="border-radius: 0px;"
-                                    src="assets/modules/6.png">
-                            </div>
-                        </a>
+                    <h6 class="mt-2 ml-2">Attendance Pages</h6>
+                </div>
+            </div>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/17.attendanceview.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
+        </div>
+
+        <div class="row shadow"
+             style="margin: 2rem; padding: 0rem !important; background-color: #fff !important; border-top:  3px solid #74788D !important; min-width: 100% !important;">
+            <div class="col-lg-12" style="padding: 2rem 1.5rem!important;">
+                <div class="d-flex my-3">
+                    <div class="d-flex justify-content-center align-items-center"
+                         style="background-color: #556EE6 !important; border: 4px solid #D4DAF9 !important; color: #fff !important; height: 35px; width: 35px; border-radius: 50% !important; font-size: 1.1rem !important;">
+                        <h6 style="margin-top: 0.3rem; color: #fff !important;">
+                            16</h6>
                     </div>
+                    <h6 class="mt-2 ml-2">Graphs with Sidebar</h6>
                 </div>
             </div>
-            <!-- Left and right controls -->
-            <a class="carousel-control-prev" href="#demo1" data-slide="prev" style="width:35px; color:#000"> <span
-                    class="carousel-control-prev-icon"><i class="fa fa-chevron-left" style="font-size:24px"></i></span>
-            </a> <a class="carousel-control-next" href="#demo1" data-slide="next" style="width:35px; color:#000">
-                <span class="carousel-control-next-icon"><i class="fa fa-chevron-right"
-                        style="font-size:24px"></i></span>
-            </a>
+            <div class="col-lg-12"
+                 style="padding-left: 0 !important; padding-right: 0!important;">
+                <img src="assets/screenshots/16grapghview.png" width="100%"
+                     height="auto" class="img-responsive">
+            </div>
         </div>
     </div>
-</div>
-<!-- END OF RELATED PRODUCTS -->
 
-<!-- OUR SERVICES -->
+    <!-- END OF SCREENSHOTS -->
 
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/star.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Our Services
-    </h2>
-</div>
+    <!-- OUR SERVICES -->
+    <section class="container" style="margin-top: 6rem !important;">
+        <div class="row">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center mb-4">
 
-<div class="container my-5">
-    <div class="row">
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px">
+                <h2
+                        style="font-weight: 300 !important; background-color: #fff !important; z-index: 1 !important; padding: 0 1rem !important;">
+                    Our Services</h2>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Customization</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/wrench.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/cogs.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Customization</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Implementation</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/lifebuoy.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/wrench.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Support</h6>
-        </div>
 
-
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/user.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/lifebuoy.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Support</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Hire
-                Odoo
-                Developer</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #54a0ff  !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/puzzle.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/user.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Hire
+                    Odoo
+                    Developer</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Integration</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/update.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #54a0ff  !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/puzzle.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Integration</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Migration</h6>
-        </div>
 
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/update.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Migration</h6>
+            </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/consultation.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/consultation.png"
+                         class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Consultancy</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Consultancy</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/training.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/training.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Implementation</h6>
-        </div>
 
-        <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-            <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                <img src="assets/icons/license.png" class="img-responsive" height="48px" width="48px">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                     style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/license.png" class="img-responsive"
+                         height="48px" width="48px">
+                </div>
+                <h6 class="text-center"
+                    style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Licensing Consultancy</h6>
             </div>
-            <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                Odoo
-                Licensing Consultancy</h6>
         </div>
-    </div>
+    </section>
+    <!-- END OF END OF OUR SERVICES -->
 
-</div>
-
-<!-- END OF END OF OUR SERVICES -->
+    <!-- OUR INDUSTRIES -->
+    <section class="container"
+             style="margin-top: 6rem !important; background-color: #fff !important;">
+        <div class="row">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center mb-4">
 
-<!-- OUR INDUSTRIES -->
+                <h2
+                        style="font-weight: 300 !important; background-color: #fff !important; z-index: 1 !important; padding: 0 1rem !important;">
+                    Our Industries</h2>
+            </div>
 
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/corporate.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Our
-        Industries
-    </h2>
-</div>
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/trading-black.png"
+                         class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Trading
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Easily
+                        procure
+                        and
+                        sell your products</p>
+                </div>
+            </div>
 
-<div class="container my-5">
-    <div class="row">
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Trading
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Easily procure
-                    and
-                    sell your products</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/pos-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    POS
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Easy
-                    configuration
-                    and convivial experience</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/education-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Education
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    A platform for
-                    educational management</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/manufacturing-black.png" class="img-responsive mb-3" height="48px"
-                    width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Manufacturing
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Plan, track and
-                    schedule your operations</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    E-commerce &amp; Website
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Mobile
-                    friendly,
-                    awe-inspiring product pages</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/service-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Service Management
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Keep track of
-                    services and invoice</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Restaurant
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    Run your bar or
-                    restaurant methodically</p>
-            </div>
-        </div>
-
-        <div class="col-lg-3">
-            <div class="my-4 d-flex flex-column justify-content-center"
-                style="background-color: #f6f8f9 !important; border-radius: 0px; padding: 2rem !important; height: 250px !important;">
-                <img src="assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                <h5 style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    Hotel Management
-                </h5>
-                <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                    An
-                    all-inclusive
-                    hotel management application</p>
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/pos-black.png"
+                         class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        POS
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Easy
+                        configuration
+                        and convivial experience</p>
+                </div>
             </div>
-        </div>
-    </div>
-</div>
 
-<!-- END OF END OF OUR INDUSTRIES -->
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/education-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Education
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        A
+                        platform for
+                        educational management</p>
+                </div>
+            </div>
 
-<!-- SUPPORT -->
-<div class="d-flex align-items-center" style="border-bottom: 2px solid #714B67; padding: 15px 0px;">
-    <div class="d-flex justify-content-center align-items-center mr-2"
-        style="background-color: #F5F5F5; border-radius: 0px; width: 40px; height: 40px;">
-        <img src="assets/misc/customer-support.png" />
-    </div>
-    <h2 class="mt-2" style="font-family: 'Montserrat', sans-serif; font-size: 24px; font-weight: bold;">Support
-    </h2>
-</div>
-<div class="container mt-5">
-    <div class="row">
-        <div class="col-sm-12 col-md-6">
-            <div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;">
-                <div class="mr-4"
-                    style="background-color: #714B67; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;">
-                    <img src="assets/misc/support.png" height="48" width="48" style="width: 42px; height: 42px;" />
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/manufacturing-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Manufacturing
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Plan,
+                        track and
+                        schedule your operations</p>
                 </div>
-                <div>
-                    <h4>Need Help?</h4>
-                    <p style="line-height: 100%;">Got questions or need help? Get in touch.</p>
-                    <a href="mailto:odoo@cybrosys.com">
-                        <p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;">
-                            odoo@cybrosys.com</p>
-                    </a>
+            </div>
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/ecom-black.png"
+                         class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        E-commerce &amp; Website
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Mobile
+                        friendly,
+                        awe-inspiring product pages</p>
                 </div>
             </div>
-        </div>
-        <div class="col-sm-12 col-md-6">
-            <div style="background-color: #F6F8F9; padding: 30px; display: flex; align-items: center;">
-                <div class="mr-4"
-                    style="background-color: #2AC44D; display: inline-block; height: 70px; width: 70px; display: flex; align-items: center; justify-content: center;">
-                    <img src="assets/misc/whatsapp.png" height="52" width="52" style="width: 52px; height: 52px;" />
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/service-black.png"
+                         class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Service Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Keep
+                        track of
+                        services and invoice</p>
                 </div>
-                <div>
-                    <h4>WhatsApp</h4>
-                    <p style="line-height: 100%;">Say hi to us on WhatsApp!</p>
-                    <a href="https://api.whatsapp.com/send?phone=918606827707">
-                        <p style="font-weight: 400; font-size: 28px; line-height: 80%; color: #714B67;">+91 86068
-                            27707</p>
-                    </a>
+            </div>
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/restaurant-black.png"
+                         class="img-responsive mb-3" height="48px"
+                         width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Restaurant
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Run
+                        your bar or
+                        restaurant methodically</p>
+                </div>
+            </div>
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                     style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/hotel-black.png"
+                         class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                            style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Hotel Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        An
+                        all-inclusive
+                        hotel management application</p>
                 </div>
             </div>
         </div>
-    </div>
-    <div class="row">
-        <div class="col-sm-12 my-5 d-flex justify-content-center align-items-center">
-            <img src="assets/misc/logo.png" width="144" height="31"
-                style="width:144px; height: 31px; margin-top: 40px;" />
+    </section>
+
+    <!-- END OF END OF OUR INDUSTRIES -->
+
+    <!-- FOOTER -->
+    <!-- Footer Section -->
+    <section class="container"
+             style="margin: 5rem auto 2rem; background-color: #fff !important;">
+        <div class="row" style="max-width:1540px;">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center mb-4">
+
+                <h2
+                        style="font-weight: 300 !important; background-color: #fff !important; z-index: 1 !important; padding: 0 1rem !important;">
+                    Need Help?</h2>
+            </div>
         </div>
-    </div>
+        <!-- Contact Cards -->
+        <div class="row d-flex justify-content-center align-items-center"
+             style="max-width:1540px; margin: 0 auto 2rem auto;">
+            <div class="col-lg-12"
+                 style="padding: 0rem 3rem 2rem; border-radius: 10px; margin-right: 3rem; ">
+                <div class="row mt-4">
+                    <div class="col-lg-6">
+                        <a href="mailto:odoo@cybrosys.com" target="_blank"
+                           class="btn btn-block mb-2 deep_hover"
+                           style="text-decoration: none;  background-color: #4d4d4d; color: #FFF;  border-radius: 4px;"><i
+                                class="fa fa-envelope mr-2"></i>odoo@cybrosys.com</a>
+                    </div>
+                    <div class="col-lg-6">
+                        <a href="https://api.whatsapp.com/send?phone=918606827707"
+                           target="_blank"
+                           class="btn btn-block mb-2 deep_hover"
+                           style="text-decoration: none;  background-color: #25D366; color: #FFF;  border-radius: 4px;">
+                            <i class="fa fa-whatsapp mr-2"></i>+91 86068
+                            27707</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- End of Contact Cards -->
+    </section>
+    <!-- Footer -->
+    <section class="oe_container"
+             style="padding: 2rem 3rem 1rem; background-color: #fff !important;">
+        <div class="row"
+             style="max-width:1540px; margin: 0 auto; margin-right: 3rem; ">
+            <!-- Logo -->
+            <div class="col-lg-12 d-flex justify-content-center align-items-center"
+                 style="margin-top: 3rem;">
+                <img src="https://www.cybrosys.com/images/logo.png"
+                     width="200px" height="auto"/>
+            </div>
+            <!-- End of Logo -->
+        </div>
+    </section>
+    <!-- END OF FOOTER -->
 </div>
-<!-- END OF SUPPORT -->
\ No newline at end of file