[UPDT] Index Updated

bom_components_image/static/description/index.html

@@ -1,369 +1,617 @@
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-header-banner.png);background-repeat:no-repeat;background-size:100%;padding: 4% 0% 2% 15%;background-position-y: -107px;">
+<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;">
-    <div class="oe_row oe_spaced">
+    <div class="row">
-        <h2 class="oe_slogan" style="font-size: 35px;color: #fff;font-weight: 900;text-transform: uppercase;text-align: left;margin: 0;margin-bottom: 16px;">
+        <div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between"
-            BOM Product Image
+            style="border-bottom: 1px solid #d5d5d5;">
-        </h2>
+            <div class="my-3">
-        <h3 class="oe_slogan" style="font-size: 25px;color: #fff;font-weight: 600;text-align: left;opacity: 1;margin: 0 !important;">
+                <img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;">
-           Includes Bill Of Material Component's Image to MRP module
+            </div>
-        </h3>
+            <div class="my-3 d-flex align-items-center">
-        <h5 class="oe_slogan" style="text-align: left;background: #fff;width: 293px;padding: 10px;color: #080808 !important;opacity: 1 !important;font-weight: 600;font-size: 20px;">
+                <div
-            <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">Cybrosys Technologies</a>
+                    style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
-        </h5>
+                    <i class="fa fa-check mr-1"></i>Community
-        <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">
+                </div>
-            <div style="width: 215px;margin-left: 57%;text-align: center;background: #ffffff;height: 215px;border-radius: 100%;display: flex;justify-content: center;align-items: center;box-shadow: 0 0 12px 4px #00000059;">
+                <div
-                    <img src="https://www.cybrosys.com/images/cybro-logo-oca.png" alt="cybrosys technologies" style="width: 180px;"/>
+                    style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
-            </div>
+                    <i class="fa fa-check mr-1"></i>Enterprise
-        </a>
+                </div>
+
+            </div>
+        </div>
     </div>
-</section>
+</div>
-
+
-
+<div class="container" style="padding: 0rem 1.5rem 4rem !important">
-<section class="oe_container" style="padding: 1% 0% 3% 15%;">
+    <div class="row" style="height: 900px !important;">
-    <div class="oe_row oe_spaced">
+        <div class="col-sm-12 col-md-12 col-lg-12"
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+            style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !important;">
-            Overview
+            <h1
-        </h2>
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important;  font-size: 3.5rem !important; text-align: center !important;">
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+                BoM Product Image</h1>
-            This app allows to view the image of bill of materials in odoo manufacturing software. BOM                 images are automatically fetched into Manufacturing orders, when user creates it. Also adds the
+            <p
-            BOM images to reports such as Production Order, BOM Cost and BOM Structure.
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 300 !important; color: #FFFFFF !important;  font-size: 1.4rem !important; text-align: center !important;">
-        </h3>
+                Includes Bill Of Material Component's Image to MRP module
+
+            </p>
+            <img src="./assets/screenshots/hero.png" class="img-responsive" width="100%" height="auto" />
+        </div>
     </div>
-</section>
+
-
+    <div class="row">
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-banner1.png); background-repeat:no-repeat; background-size:cover;padding: 10% 0% 25% 15%;">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin-bottom: 2rem !important">
-    <div class="oe_row oe_spaced">
+            <h2
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-             Features
+                <i class="fa fa-compass mr-2"></i>Explore this module
-        </h2>
+            </h2>
-         <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+        </div>
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+        <div class="col-md-6">
-             Smart button to show whether the current product is a component of BOM
+            <a href="#overview" style="text-decoration: none !important;">
-         </h3>
+                <div class="row"
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+                    <div class="col-8">
-            Edit or delete product image in BOM
+                        <h3
-         </h3>
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+                            Overview</h3>
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+                        <p
-            Get BOM product images into manufacturing Orders by default.
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
-         </h3>
+                            Learn more about this module</p>
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+                    </div>
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
-            Includes BOM images to reports such as Production Order, BOM Cost and BOM Structure.
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
-         </h3>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#features" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Features</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            View features of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#screenshots" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Screenshots</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            See key screenshots of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+
+    </div>
+
+
+    <div class="row" id="overview">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-pie-chart mr-2"></i>Overview
+            </h2>
+        </div>
+
+        <div class="col-mg-12 pl-3">
+            <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important; line-height: 30px !important;">
+                This app allows to view the image of bill of materials in odoo manufacturing software. BOM images
+                are automatically fetched into Manufacturing orders, when user creates it. Also adds the BOM images
+                to reports such as Production Order, BOM Cost and BOM Structure.</p>
+
+        </div>
+    </div>
+
+
+    <div class="row" id="features">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-star mr-2"></i>Features
+            </h2>
+        </div>
+
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Smart button to show whether the current product is a component of BOM</h4>
+
+            </div>
+        </div>
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Edit or delete product image in BOM</h4>
+
+            </div>
+        </div>
+
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Get BOM product images into manufacturing Orders by default</h4>
+
+            </div>
+        </div>
+
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Includes BOM images to reports such as Production Order, BOM Cost and BOM Structure</h4>
+
+            </div>
+        </div>
+
+
     </div>
-</section>
+
-
+    <div class="row" id="screenshots">
-<section class="oe_container" style="padding: 3% 0% 0% 15%;">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-    <div class="oe_row oe_spaced">
+            <h2
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-            Screenshots
+                <i class="fa fa-image mr-2"></i>Screenshots
-        </h2>
+            </h2>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-            This is to show whether the current product is a component of BOM also press the button to open all related bill of material.
-            The count is generated in real time on the Smart button.
-         </h3>
-        <div class="oe_row oe_spaced">
-            <img src="bom-components-cybrosys-1.png" alt="" style="width: 95%;"/>
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+        <div class="col-lg-12 my-2">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+            <h4 class="mt-2"
-            Manufacturing ---> Bill Of Material ---> Components</br>
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-            Here we can edit or delete new images to BOM components. Otherwise default image of the corresponding product is selected.
+                This is to show whether the current product is a component of BOM also press the button to open all
-        </h3>
+                related bill of material. The count is generated in real time on the Smart button</h4>
-        <div class="oe_row oe_spaced">
+
-            <img src="bom-components-cybrosys-2.png" alt="" style="width: 95%;"/>
+            <img src="assets/screenshots/bom_components_image-1.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+        <div class="col-lg-12 my-3">
-            Generate BOM product images automatically, when user creates a manufacturing order.
+            <h4 class="mt-3"
-        </h3>
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-        <div class="oe_row oe_spaced">
+                Manufacturing ---> Bill Of Material ---> Components Here we can edit or delete new images to BOM
-            <img src="bom-components-cybrosys-3.png" alt="" style="width: 95%;"/>
+                components. Otherwise default image of the corresponding product is selected</h4>
+
+            <img src="assets/screenshots/bom_components_image-2.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+        <div class="col-lg-12 my-3">
-            Production Order</br>
+            <h4 class="mt-3"
-            Manufacturing --->Manufacturing Orders --->Print --->Production Order
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-        </h3>
+                Generate BOM product images automatically, when user creates a manufacturing order</h4>
-        <div class="oe_row oe_spaced">
+
-            <img src="bom-components-cybrosys-4.png" alt="" style="width: 95%;"/>
+            <img src="assets/screenshots/bom_components_image-3.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+
-            BOM Cost</br>
+        <div class="col-lg-12 my-3">
-            Manufacturing --->Bill Of Material --->Print --->BOM Cost
+            <h4 class="mt-3"
-        </h3>
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-        <div class="oe_row oe_spaced">
+                Production Order Manufacturing --->Manufacturing Orders --->Print --->Production Order</h4>
-            <img src="bom-components-cybrosys-5.png" alt="" style="width: 95%;"/>
+
+            <img src="assets/screenshots/bom_components_image-4.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+
+        <div class="col-lg-12 my-3">
+            <h4 class="mt-3"
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                BOM Cost Manufacturing --->Bill Of Material --->Print --->BOM Cost</h4>
+
+            <img src="assets/screenshots/bom_components_image-5.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
         </div>
 
+
+
     </div>
-</section>
+
-
+
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
+    <!-- SUGGESTED PRODUCTS -->
-     <div class="oe_row oe_spaced">
+    <div class="row">
-         <a style="color: #080808 !important;" href="https://apps.odoo.com/apps/modules/browse?search=cybrosys" target="_blank"><img src="https://www.cybrosys.com/images/view-more-apps.jpg" alt="cybrosys technologies" style="width: 100%;margin-bottom: 50px;"/></a>
+        <div class="col-lg-12 d-flex flex-column justify-content-center"
-     </div>
+            style="text-align: center; padding: 2.5rem 1rem !important;">
-</section>
+            <h2 style="color: #212529 !important;">Suggested Products</h2>
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
+            <hr
-    <div class="oe_row oe_spaced">
+                style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+
-            Our Services
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
-        </h2>
+                <!-- The slideshow -->
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
+                <div class="carousel-inner">
-            <div style="flex-basis: 18%;">
+                    <div class="carousel-item active" style="min-height:0px">
-
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                    <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/export_stockinfo_xls/" target="_blank">
-                            <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                                <div style="border-radius:10px">
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/export_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/dashboard_pos/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/pos_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/product_approval_management/"
+                                target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/approval_image.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                    <div class="carousel-item" style="min-height:0px">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/base_account_budget/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/budget_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/shopify_odoo_connector/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/shopify_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/odoo11_magento2/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/magento_image.png">
+                                </div>
                             </a>
+                        </div>
                     </div>
-                     <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                </div>
-                         <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                <!-- Left and right controls -->
-                        Odoo Customization
+                <a class="carousel-control-prev" href="#demo1" data-slide="prev"
-                         </a>
+                    style="left:-25px;width: 35px;color: #000;"> <span class="carousel-control-prev-icon"><i
-                     </h3>
+                            class="fa fa-chevron-left" style="font-size:24px"></i></span> </a> <a
+                    class="carousel-control-next" href="#demo1" data-slide="next"
+                    style="right:-25px;width: 35px;color: #000;">
+                    <span class="carousel-control-next-icon"><i class="fa fa-chevron-right"
+                            style="font-size:24px"></i></span>
+                </a>
+            </div>
+        </div>
+    </div>
+    <!-- END OF SUGGESTED PRODUCTS -->
 
+    <!-- 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">
+                <h2 style="color: #212529 !important;">Our Services</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/odoo-erp-implementation.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                    Odoo
-                        Odoo Implementation </a>
+                    Customization</h6>
-                 </h3>
+            </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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                        <img src="https://www.cybrosys.com/images/odoo-erp-integration.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                    </a>
+                    <img src="assets/icons/lifebuoy.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                    Odoo
-                        Odoo Integration
+                    Support</h6>
-                    </a>
+            </div>
-                 </h3>
 
+
+            <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>
+
+            <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>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/odoo-erp-support.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/update.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+                    Odoo
-                        Odoo Support</a>
+                    Migration</h6>
-                 </h3>
+            </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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Consultancy</h6>
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/hire-odoo-developer.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/training.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+                    Odoo
-                        Hire Odoo Developers</a>
+                    Implementation</h6>
-                 </h3>
+            </div>
-                     </a>
+
+            <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>
         </div>
-    </div>
+    </section>
-</section>
+    <!-- END OF END OF OUR SERVICES -->
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
-     <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-            Our Industries
-        </h2>
-        <div style="display:flex;justify-content: space-between;flex-wrap:wrap;">
-            <div style="flex-basis: 32%;padding-top: 20px;">
-
-                    <div style="width:30%; float:left;">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
-                            <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-1.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
-                            </a>
-                        </div>
-                    </div>
-                    <div style="width:70%;float:left;">
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
-                         <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                        Trading
-                         </a>
-                     </h3>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        Easily procure and sell your products.
-                     </h3>
-                        </div>
 
+    <!-- OUR INDUSTRIES -->
+    <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">
+                <h2 style="color: #212529 !important;">Our Industries</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-2.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Trading
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
+                        Easily procure
-                            Manufacturing</a>
+                        and
-                     </h3>
+                        sell your products</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Plan, track and schedule your operations.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-3.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/education-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Education
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            Restaurant</a>
+                        A platform for
-                     </h3>
+                        educational management</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Run your bar or restaurant methodical.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-4.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        E-commerce &amp; Website
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                        Mobile
-                            POS</a>
+                        friendly,
-                     </h3>
+                        awe-inspiring product pages</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Easy configuring and convivial selling.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-5.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Restaurant
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 0px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            E-commerce & Website</a>
+                        Run your bar or
-                     </h3>
+                        restaurant methodically</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Mobile friendly, awe-inspiring product pages.
-                     </h3>
-                    </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-6.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Hotel Management
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                        An
-                            Hotel Management</a>
+                        all-inclusive
-                     </h3>
+                        hotel management application</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        An all-inclusive hotel management application.
-                     </h3>
-                        </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+        </div>
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+    </section>
-                            <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-7.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+    <!-- END OF END OF OUR INDUSTRIES -->
-                            </a>
+
-                        </div>
+    <!-- FOOTER -->
-                    </div>
+    <!-- Footer Section -->
-                    <div style="width:70%;float:left;">
+    <section class="container" style="margin: 5rem auto 2rem;">
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+        <div class="row" style="max-width:1540px;">
-                        <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
-                            Education</a>
+                <h2 style="color: #212529 !important;">Need Help?</h2>
-                     </h3>
+                <hr
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-                        A Collaborative platform for educational management.
-                     </h3>
-                        </div>
             </div>
-             <div style="flex-basis: 32%;padding-top: 20px;">
+        </div>
 
-                    <div style="width:30%; float:left;">
+        <!-- Contact Cards -->
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+        <div class="row d-flex justify-content-center align-items-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+            style="max-width:1540px; margin: 0 auto 2rem auto;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-8.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+
-                            </a>
+            <div class="col-lg-12" style="padding: 0rem 3rem 2rem; border-radius: 10px; margin-right: 3rem; ">
-                        </div>
+
+                <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 style="width:70%;float:left;">
+                    <div class="col-lg-6">
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                        <a href="https://api.whatsapp.com/send?phone=918606827707" target="_blank"
-                        <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+                            class="btn btn-block mb-2 deep_hover"
-                            Service Management</a>
+                            style="text-decoration: none;  background-color: #25D366; color: #FFF;  border-radius: 4px;"><i
-                     </h3>
+                                class="fa fa-whatsapp mr-2"></i>WhatsApp</a>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                    </div>
-                        Keep track of services and invoice accordingly.
+                </div>
-                     </h3>
-                        </div>
             </div>
+
         </div>
-    </div>
+        <!-- End of Contact Cards -->
-</section>
+    </section>
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-footer-bg.png); background-repeat:no-repeat; background-size:100%;padding: 13% 0% 6% 0%;">
+    <!-- Footer -->
-    <div class="oe_slogan" style="margin-top:10px !important;margin-bottom: 0px;">
+    <section class="oe_container" style="padding: 2rem 3rem 1rem;">
-        <div>
+        <div class="row" style="max-width:1540px; margin: 0 auto; margin-right: 3rem; ">
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="mailto:odoo@cybrosys.com"><i class="fa fa-envelope"></i> Email us </a>
+            <!-- Logo -->
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-phone"></i> Contact Us </a>
+            <div class="col-lg-12 d-flex justify-content-center align-items-center" style="margin-top: 3rem;">
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-check-square"></i> Request Customization </a>
+                <img src="https://www.cybrosys.com/images/logo.png" width="200px" height="auto" />
-        </div>
+            </div>
-        <br>
+            <!-- End of Logo -->
-        <img src="https://www.cybrosys.com/images/logo.png" style="width: 190px; margin-bottom: 25px;margin-top: 30px;" class="center-block">
+            <div class="col-lg-12">
-        <div>
+                <hr
-          <a href="https://twitter.com/cybrosys" target="_blank"><i class="fa fa-2x fa-twitter" style="color:white;background: #00a0d1;width:35px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
+                    style="margin-top: 3rem;background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(229,229,229,1) 33%, rgba(229,229,229,1) 58%, rgba(0,212,255,0) 100%); height: 2px; border-style: none;">
-          <a href="https://www.linkedin.com/company/cybrosys-technologies-pvt-ltd" target="_blank"><i class="fa fa-2x fa-linkedin" style="color:white;background: #31a3d6;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
+                <!-- End of Footer Section -->
-          <a href="https://www.facebook.com/cybrosystechnologies" target="_blank"><i class="fa fa-2x fa-facebook" style="color:white;background: #3b5998;width:35px; ;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
+            </div>
-          <a href="https://plus.google.com/106641282743045431892/about" target="_blank"><i class="fa fa-2x fa-google-plus" style="color:white;background: #c53c2c;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://in.pinterest.com/cybrosys" target="_blank"><i class="fa fa-2x fa-pinterest" style="color:white;background: #ac0f18;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
         </div>
-    </div>
+    </section>
-</section>
+    <!-- END OF FOOTER -->
+
+</div>

crm_drag_back_permission/static/description/index.html

@@ -1,362 +1,570 @@
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-header-banner.png);background-repeat:no-repeat;background-size:100%;padding: 4% 0% 2% 15%;background-position-y: -107px;">
+<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;">
-    <div class="oe_row oe_spaced">
+    <div class="row">
-        <h2 class="oe_slogan" style="font-size: 35px;color: #fff;font-weight: 900;text-transform: uppercase;text-align: left;margin: 0;margin-bottom: 16px;">
+        <div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between"
-            CRM Kanban Drag Back
+            style="border-bottom: 1px solid #d5d5d5;">
-        </h2>
+            <div class="my-3">
-        <h3 class="oe_slogan" style="font-size: 25px;color: #fff;font-weight: 600;text-align: left;opacity: 1;margin: 0 !important;">
+                <img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;">
-            Permission for Back Drag in CRM Kanban view
-        </h3>
-        <h5 class="oe_slogan" style="text-align: left;background: #fff;width: 293px;padding: 10px;color: #080808 !important;opacity: 1 !important;font-weight: 600;font-size: 20px;">
-            <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">Cybrosys Technologies</a>
-        </h5>
-        <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">
-            <div style="width: 215px;margin-left: 57%;text-align: center;background: #ffffff;height: 215px;border-radius: 100%;display: flex;justify-content: center;align-items: center;box-shadow: 0 0 12px 4px #00000059;">
-                    <img src="https://www.cybrosys.com/images/cybro-logo-oca.png" alt="cybrosys technologies" style="width: 180px;"/>
             </div>
-        </a>
+            <div class="my-3 d-flex align-items-center">
+                <div
+                    style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Community
+                </div>
+                <div
+                    style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Enterprise
+                </div>
+
+            </div>
+        </div>
     </div>
-</section>
+</div>
-
+
-<section class="oe_container" style="padding: 1% 0% 3% 15%;">
+<div class="container" style="padding: 0rem 1.5rem 4rem !important">
-    <div class="oe_row oe_spaced">
+    <div class="row" style="height: 900px !important;">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+        <div class="col-sm-12 col-md-12 col-lg-12"
-            Overview
+            style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !important;">
-        </h2>
+            <h1
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important;  font-size: 3.5rem !important; text-align: center !important;">
-            This module restricts some users to drag leads backwards in sales pipeline without permission.
+                CRM Kanban Drag Back Permission</h1>
-        </h3>
+            <p
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 300 !important; color: #FFFFFF !important;  font-size: 1.4rem !important; text-align: center !important;">
+                Permission for Back Drag in CRM Kanban view
+
+            </p>
+            <img src="./assets/screenshots/hero.png" class="img-responsive" width="100%" height="auto" />
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin-bottom: 2rem !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-compass mr-2"></i>Explore this module
+            </h2>
+        </div>
+        <div class="col-md-6">
+            <a href="#overview" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Overview</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            Learn more about this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#features" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Features</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            View features of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#screenshots" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Screenshots</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            See key screenshots of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+
     </div>
-</section>
-
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-banner.png); background-repeat:no-repeat; background-size:cover;padding: 19% 0% 30% 15%;">
-    <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-             Features
-        </h2>
-         <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-             Restricts some users to drag leads backwards in sales pipeline.
-         </h3>
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-             Allows the administrator or head of the team to approve leads.
-         </h3>
 
+
+    <div class="row" id="overview">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-pie-chart mr-2"></i>Overview
+            </h2>
+        </div>
+
+        <div class="col-mg-12 pl-3">
+            <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important; line-height: 30px !important;">
+                This module restricts some users to drag leads backwards in sales pipeline without permission.</p>
+
+        </div>
     </div>
-</section>
+
-
+
-<section class="oe_container" style="padding: 3% 0% 0% 15%;">
+    <div class="row" id="features">
-    <div class="oe_row oe_spaced">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+            <h2
-            Screenshots
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-        </h2>
+                <i class="fa fa-star mr-2"></i>Features
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+            </h2>
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-            Go to Configuration -> Stages, and set an 'order'(integer value) for each stage you want to use in the pipeline.
-            The drag back works based on this 'order' field value.
-        </h3>
-        <div class="oe_row oe_spaced">
-            <img src="cybrosys-kanban-dragback-2.png" alt="" style="width: 95%;"/>
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+        <div class="col-md-6 pl-3 py-3 d-flex">
-            Shows the leads that are in the 'Waiting for Approval' State
+            <div>
-         </h3>
+                <img src="assets/icons/check.png">
-        <div class="oe_row oe_spaced">
+            </div>
-            <img src="cybrosys-kanban-dragback-3.png" alt="" style="width: 95%;"/>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Restricts some users to drag leads backwards in sales pipeline</h4>
+
+            </div>
         </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+        <div class="col-md-6 pl-3 py-3 d-flex">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+            <div>
-            The Administrator or the Head of Sales of team which the lead belongs to, can approve the lead to the stage requested by the user or decline the lead back to it's previous stage.
+                <img src="assets/icons/check.png">
-         </h3>
+            </div>
-        <div class="oe_row oe_spaced">
+            <div>
-            <img src="cybrosys-kanban-dragback-5.png" alt="" style="width: 95%;"/>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Allows the administrator or head of the team to approve leads</h4>
+
+            </div>
         </div>
+
     </div>
-</section>
+
-
+    <div class="row" id="screenshots">
-
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-<section class="oe_container oe_dark">
+            <h2
-    <h2 class="oe_slogan">Need Any Help?</h2>
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-    <div class="oe_slogan">
+                <i class="fa fa-image mr-2"></i>Screenshots
-        <a  class="btn btn-primary btn-lg mt8"
+            </h2>
-            style="color: #FFFFFF !important;" href="http://www.cybrosys.com"><i
+        </div>
-            class="fa fa-envelope"></i> Email </a> <a
+        <div class="col-lg-12 my-2">
-            class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;"
+            <h4 class="mt-2"
-            href="http://www.cybrosys.com/contact/"><i
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-            class="fa fa-phone"></i> Contact Us </a> <a
+                Go to Configuration -> Stages, and set an 'order'(integer value) for each stage you want to use in
-            class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;"
+                the pipeline. The drag back works based on this 'order' field value.</h4>
-            href="http://www.cybrosys.com/odoo-customization-and-installation/"><i
+
-            class="fa fa-check-square"></i> Request Customization </a>
+            <img src="assets/screenshots/crm_drag_back_permission-1.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+        <div class="col-lg-12 my-3">
+            <h4 class="mt-3"
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                Shows the leads that are in the 'Waiting for Approval' State</h4>
+
+            <img src="assets/screenshots/crm_drag_back_permission-2.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+        <div class="col-lg-12 my-3">
+            <h4 class="mt-3"
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                The Administrator or the Head of Sales of team which the lead belongs to, can approve the lead to
+                the stage requested by the user or decline the lead back to it's previous stage.</h4>
+
+            <img src="assets/screenshots/crm_drag_back_permission-3.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+
+
     </div>
-</section>
+
-
+
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
+    <!-- SUGGESTED PRODUCTS -->
-     <div class="oe_row oe_spaced">
+    <div class="row">
-         <a style="color: #080808 !important;" href="https://apps.odoo.com/apps/modules/browse?search=cybrosys" target="_blank"><img src="https://www.cybrosys.com/images/view-more-apps.jpg" alt="cybrosys technologies" style="width: 100%;margin-bottom: 50px;"/></a>
+        <div class="col-lg-12 d-flex flex-column justify-content-center"
-     </div>
+            style="text-align: center; padding: 2.5rem 1rem !important;">
-</section>
+            <h2 style="color: #212529 !important;">Suggested Products</h2>
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
+            <hr
-    <div class="oe_row oe_spaced">
+                style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+
-            Our Services
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
-        </h2>
+                <!-- The slideshow -->
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
+                <div class="carousel-inner">
-            <div style="flex-basis: 18%;">
+                    <div class="carousel-item active" style="min-height:0px">
-
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                    <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/export_stockinfo_xls/" target="_blank">
-                            <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                                <div style="border-radius:10px">
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/export_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/dashboard_pos/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/pos_image.png">
+                                </div>
                             </a>
+                        </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/14.0/product_approval_management/"
+                                target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/approval_image.png">
+                                </div>
+                            </a>
+                        </div>
                     </div>
-                     <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                    <div class="carousel-item" style="min-height:0px">
-                         <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                        Odoo Customization
+                            <a href="https://apps.odoo.com/apps/modules/14.0/base_account_budget/" target="_blank">
-                         </a>
+                                <div style="border-radius:10px">
-                     </h3>
+                                    <img class="img img-responsive center-block"
-
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/budget_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/shopify_odoo_connector/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/shopify_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/odoo11_magento2/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/magento_image.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+                <!-- Left and right controls -->
+                <a class="carousel-control-prev" href="#demo1" data-slide="prev"
+                    style="left:-25px;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="right:-25px;width: 35px;color: #000;">
+                    <span class="carousel-control-next-icon"><i class="fa fa-chevron-right"
+                            style="font-size:24px"></i></span>
+                </a>
+            </div>
+        </div>
+    </div>
+    <!-- END OF SUGGESTED PRODUCTS -->
+
+    <!-- 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">
+                <h2 style="color: #212529 !important;">Our Services</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/odoo-erp-implementation.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                    Odoo
-                        Odoo Implementation </a>
+                    Customization</h6>
-                 </h3>
-
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                        <img src="https://www.cybrosys.com/images/odoo-erp-integration.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #ff6b6b !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                    </a>
+                    <img src="assets/icons/wrench.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                    Odoo
-                        Odoo Integration
+                    Implementation</h6>
-                    </a>
+            </div>
-                 </h3>
 
+            <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>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+
-                        <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                            <img src="https://www.cybrosys.com/images/odoo-erp-support.png" style="width: 100%;border-radius: 100%;"/>
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                        </a>
+                    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>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+                    Hire
-                        Odoo Support</a>
+                    Odoo
-                 </h3>
+                    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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Integration</h6>
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/hire-odoo-developer.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/update.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+                    Odoo
-                        Hire Odoo Developers</a>
+                    Migration</h6>
-                 </h3>
-                     </a>
             </div>
-        </div>
-    </div>
-</section>
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
-     <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-            Our Industries
-        </h2>
-        <div style="display:flex;justify-content: space-between;flex-wrap:wrap;">
-            <div style="flex-basis: 32%;padding-top: 20px;">
-
-                    <div style="width:30%; float:left;">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
-                            <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-1.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
-                            </a>
-                        </div>
-                    </div>
-                    <div style="width:70%;float:left;">
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
-                         <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                        Trading
-                         </a>
-                     </h3>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        Easily procure and sell your products.
-                     </h3>
-                        </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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Consultancy</h6>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
+                    style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-2.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="assets/icons/training.png" class="img-responsive" height="48px" width="48px">
-                            </a>
+                </div>
-                        </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    </div>
+                    Odoo
-                    <div style="width:70%;float:left;">
+                    Implementation</h6>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+            </div>
-                        <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
-                            Manufacturing</a>
-                     </h3>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        Plan, track and schedule your operations.
-                     </h3>
-                        </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>
+                <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 -->
+
+    <!-- OUR INDUSTRIES -->
+    <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">
+                <h2 style="color: #212529 !important;">Our Industries</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-3.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Trading
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                        Easily procure
-                            Restaurant</a>
+                        and
-                     </h3>
+                        sell your products</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Run your bar or restaurant methodical.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-4.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/education-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Education
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            POS</a>
+                        A platform for
-                     </h3>
+                        educational management</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Easy configuring and convivial selling.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-5.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        E-commerce &amp; Website
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 0px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                        Mobile
-                            E-commerce & Website</a>
+                        friendly,
-                     </h3>
+                        awe-inspiring product pages</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Mobile friendly, awe-inspiring product pages.
-                     </h3>
-                    </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-6.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/service-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Service Management
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                        Keep track of
-                            Hotel Management</a>
+                        services and invoice</p>
-                     </h3>
+                </div>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        An all-inclusive hotel management application.
-                     </h3>
-                        </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-7.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Restaurant
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            Education</a>
+                        Run your bar or
-                     </h3>
+                        restaurant methodically</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        A Collaborative platform for educational management.
-                     </h3>
-                        </div>
             </div>
-             <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-8.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Hotel Management
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+                        An
-                            Service Management</a>
+                        all-inclusive
-                     </h3>
+                        hotel management application</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Keep track of services and invoice accordingly.
-                     </h3>
-                        </div>
             </div>
+
         </div>
-    </div>
+    </section>
-</section>
+
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-footer-bg.png); background-repeat:no-repeat; background-size:100%;padding: 13% 0% 6% 0%;">
+    <!-- END OF END OF OUR INDUSTRIES -->
-    <div class="oe_slogan" style="margin-top:10px !important;margin-bottom: 0px;">
+
-        <div>
+    <!-- FOOTER -->
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="mailto:odoo@cybrosys.com"><i class="fa fa-envelope"></i> Email us </a>
+    <!-- Footer Section -->
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-phone"></i> Contact Us </a>
+    <section class="container" style="margin: 5rem auto 2rem;">
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-check-square"></i> Request Customization </a>
+        <div class="row" style="max-width:1540px;">
-        </div>
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
-        <br>
+                <h2 style="color: #212529 !important;">Need Help?</h2>
-        <img src="https://www.cybrosys.com/images/logo.png" style="width: 190px; margin-bottom: 25px;margin-top: 30px;" class="center-block">
+                <hr
-        <div>
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-          <a href="https://twitter.com/cybrosys" target="_blank"><i class="fa fa-2x fa-twitter" style="color:white;background: #00a0d1;width:35px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
+            </div>
-          <a href="https://www.linkedin.com/company/cybrosys-technologies-pvt-ltd" target="_blank"><i class="fa fa-2x fa-linkedin" style="color:white;background: #31a3d6;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://www.facebook.com/cybrosystechnologies" target="_blank"><i class="fa fa-2x fa-facebook" style="color:white;background: #3b5998;width:35px; ;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://plus.google.com/106641282743045431892/about" target="_blank"><i class="fa fa-2x fa-google-plus" style="color:white;background: #c53c2c;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://in.pinterest.com/cybrosys" target="_blank"><i class="fa fa-2x fa-pinterest" style="color:white;background: #ac0f18;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
         </div>
-    </div>
-</section>
 
+        <!-- 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>WhatsApp</a>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+        <!-- End of Contact Cards -->
+    </section>
+    <!-- Footer -->
+    <section class="oe_container" style="padding: 2rem 3rem 1rem;">
+        <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 class="col-lg-12">
+                <hr
+                    style="margin-top: 3rem;background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(229,229,229,1) 33%, rgba(229,229,229,1) 58%, rgba(0,212,255,0) 100%); height: 2px; border-style: none;">
+                <!-- End of Footer Section -->
+            </div>
+        </div>
+    </section>
+    <!-- END OF FOOTER -->
 
+</div>

hr_employee_attendance/static/description/index.html

@@ -1,331 +1,552 @@
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-header-banner.png);background-repeat:no-repeat;background-size:100%;padding: 4% 0% 2% 15%;background-position-y: -107px;">
+<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;">
-    <div class="oe_row oe_spaced">
+    <div class="row">
-        <h2 class="oe_slogan" style="font-size: 35px;color: #fff;font-weight: 900;text-transform: uppercase;text-align: left;margin: 0;margin-bottom: 16px;">
+        <div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between"
-           Employee Attendance
+            style="border-bottom: 1px solid #d5d5d5;">
-        </h2>
+            <div class="my-3">
-        <h3 class="oe_slogan" style="font-size: 25px;color: #fff;font-weight: 600;text-align: left;opacity: 1;margin: 0 !important;">
+                <img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;">
-           Attendance View for Employee
-        </h3>
-        <h5 class="oe_slogan" style="text-align: left;background: #fff;width: 293px;padding: 10px;color: #080808 !important;opacity: 1 !important;font-weight: 600;font-size: 20px;">
-            <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">Cybrosys Technologies</a>
-        </h5>
-        <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">
-            <div style="width: 215px;margin-left: 57%;text-align: center;background: #ffffff;height: 215px;border-radius: 100%;display: flex;justify-content: center;align-items: center;box-shadow: 0 0 12px 4px #00000059;">
-                    <img src="https://www.cybrosys.com/images/cybro-logo-oca.png" alt="cybrosys technologies" style="width: 180px;"/>
             </div>
-        </a>
+            <div class="my-3 d-flex align-items-center">
+                <div
+                    style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Community
+                </div>
+                <div
+                    style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Enterprise
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="container" style="padding: 0rem 1.5rem 4rem !important">
+    <div class="row" style="height: 900px !important;">
+        <div class="col-sm-12 col-md-12 col-lg-12"
+            style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !important;">
+            <h1
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important;  font-size: 3.5rem !important; text-align: center !important;">
+                Employee Attendance</h1>
+            <p
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 300 !important; color: #FFFFFF !important;  font-size: 1.4rem !important; text-align: center !important;">
+                Attendance View for Employee
+            </p>
+            <img src="./assets/screenshots/hero.png" class="img-responsive" width="100%" height="auto" />
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin-bottom: 2rem !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-compass mr-2"></i>Explore this module
+            </h2>
+        </div>
+        <div class="col-md-6">
+            <a href="#overview" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Overview</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            Learn more about this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#features" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Features</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            View features of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+        <div class="col-md-6">
+            <a href="#screenshots" style="text-decoration: none !important;">
+                <div class="row"
+                    style="background-color: #f5f2f5 !important; border-radius: 10px !important; margin: 1rem !important; padding: 1.5em !important; height: 100px !important;">
+                    <div class="col-8">
+                        <h3
+                            style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.2rem !important;">
+                            Screenshots</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            See key screenshots of this module</p>
+                    </div>
+                    <div class="col-4 text-right d-flex justify-content-end align-items-center">
+                        <i class="fa fa-chevron-right" style="color: #714B67 !important;"></i>
+                    </div>
+                </div>
+            </a>
+        </div>
+
     </div>
-</section>
+
-<section class="oe_container" style="padding: 1% 0% 3% 15%;">
+
-    <div class="oe_row oe_spaced">
+    <div class="row" id="overview">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-            Overview
+            <h2
-        </h2>
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+                <i class="fa fa-pie-chart mr-2"></i>Overview
-           Currently, Odoo does not support attendance view for normal
+            </h2>
-            users. Normal users can register their sign in/ sign out time, but they cant
+        </div>
-            view the attendance log later. Employee attendance module will add this
+
-            feature so that the normal employees also can view their attendance details.
+        <div class="col-mg-12 pl-3">
-        </h3>
+            <p
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #282F33 !important; font-size: 1rem !important; line-height: 30px !important;">
+                Currently, Odoo does not support attendance view for normal users. Normal users can register their
+                sign in/ sign out time, but they cant view the attendance log later. Employee attendance module will
+                add this feature so that the normal employees also can view their attendance details.</p>
+
+        </div>
     </div>
-</section>
+
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-banner.png); background-repeat:no-repeat; background-size:cover;padding: 5% 0% 15% 15%;">
+
-    <div class="oe_row oe_spaced">
+    <div class="row" id="features">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-             Features
+            <h2
-        </h2>
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-         <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+                <i class="fa fa-star mr-2"></i>Features
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+            </h2>
-            Employee can view their attendance
+        </div>
-         </h3>
+
-         <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+        <div class="col-md-6 pl-3 py-3 d-flex">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
+            <div>
-           View Login, Logout timings
+                <img src="assets/icons/check.png">
-         </h3>
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Employee can view their attendance</h4>
+
+            </div>
+        </div>
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    View Login, Logout timings</h4>
+
+            </div>
+        </div>
+
+
     </div>
-</section>
+
-<section class="oe_container" style="padding: 3% 0% 0% 15%;">
+    <div class="row" id="screenshots">
-    <div class="oe_row oe_spaced">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+            <h2
-            Screenshots
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-        </h2>
+                <i class="fa fa-image mr-2"></i>Screenshots
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
+            </h2>
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-           Attendance Menu
-         </h3>
-        <div class="oe_row oe_spaced">
-            <img src="employee-attendance-cybrosys-1.png" alt="" style="width: 95%;"/>
         </div>
+        <div class="col-lg-12 my-2">
+            <h4 class="mt-2"
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                Attendance Menu</h4>
+
+            <img src="assets/screenshots/employee-attendance-cybrosys-1.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+
     </div>
-</section>
+
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
+
-     <div class="oe_row oe_spaced">
+
-         <a style="color: #080808 !important;" href="https://apps.odoo.com/apps/modules/browse?search=cybrosys" target="_blank"><img src="https://www.cybrosys.com/images/view-more-apps.jpg" alt="cybrosys technologies" style="width: 100%;margin-bottom: 50px;"/></a>
+    <!-- SUGGESTED PRODUCTS -->
-     </div>
+    <div class="row">
-</section>
+        <div class="col-lg-12 d-flex flex-column justify-content-center"
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
+            style="text-align: center; padding: 2.5rem 1rem !important;">
-    <div class="oe_row oe_spaced">
+            <h2 style="color: #212529 !important;">Suggested Products</h2>
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+            <hr
-            Our Services
+                style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-        </h2>
+
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
-            <div style="flex-basis: 18%;">
+                <!-- The slideshow -->
-
+                <div class="carousel-inner">
-                    <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+                    <div class="carousel-item active" style="min-height:0px">
-                            <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
+                            <a href="https://apps.odoo.com/apps/modules/14.0/export_stockinfo_xls/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/export_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/dashboard_pos/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/pos_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/product_approval_management/"
+                                target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/approval_image.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                    <div class="carousel-item" style="min-height:0px">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/base_account_budget/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/budget_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/shopify_odoo_connector/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/shopify_image.png">
+                                </div>
+                            </a>
+                        </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/14.0/odoo11_magento2/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/magento_image.png">
+                                </div>
                             </a>
+                        </div>
                     </div>
-                     <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                </div>
-                         <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                <!-- Left and right controls -->
-                        Odoo Customization
+                <a class="carousel-control-prev" href="#demo1" data-slide="prev"
-                         </a>
+                    style="left:-25px;width: 35px;color: #000;"> <span class="carousel-control-prev-icon"><i
-                     </h3>
+                            class="fa fa-chevron-left" style="font-size:24px"></i></span> </a> <a
+                    class="carousel-control-next" href="#demo1" data-slide="next"
+                    style="right:-25px;width: 35px;color: #000;">
+                    <span class="carousel-control-next-icon"><i class="fa fa-chevron-right"
+                            style="font-size:24px"></i></span>
+                </a>
+            </div>
+        </div>
+    </div>
+    <!-- END OF SUGGESTED PRODUCTS -->
 
+    <!-- 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">
+                <h2 style="color: #212529 !important;">Our Services</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/odoo-erp-implementation.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
+                    Odoo
-                        Odoo Implementation </a>
+                    Customization</h6>
-                 </h3>
+            </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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
             </div>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                        <img src="https://www.cybrosys.com/images/odoo-erp-integration.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #6462CD !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                    </a>
+                    <img src="assets/icons/lifebuoy.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
+                    Odoo
-                        Odoo Integration
+                    Support</h6>
-                    </a>
+            </div>
-                 </h3>
 
+
+            <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>
-             <div style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <img src="https://www.cybrosys.com/images/odoo-erp-support.png" style="width: 100%;border-radius: 100%;"/>
+                    style="background-color: #54a0ff  !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                        </a>
+                    <img src="assets/icons/puzzle.png" class="img-responsive" height="48px" width="48px">
                 </div>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
+                    Odoo
-                        Odoo Support</a>
+                    Integration</h6>
-                 </h3>
+            </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 style="flex-basis: 18%;">
 
-                <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+
-                        <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                            <img src="https://www.cybrosys.com/images/hire-odoo-developer.png" style="width: 100%;border-radius: 100%;"/>
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                        </a>
+                    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>
-                 <h3 class="oe_slogan" style="font-weight: 800;text-align: center;font-size: 14px;width: 100%;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;">
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
+                    Odoo
-                        Hire Odoo Developers</a>
+                    Consultancy</h6>
-                 </h3>
-                     </a>
             </div>
-        </div>
-    </div>
-</section>
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
-     <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-            Our Industries
-        </h2>
-        <div style="display:flex;justify-content: space-between;flex-wrap:wrap;">
-            <div style="flex-basis: 32%;padding-top: 20px;">
-
-                    <div style="width:30%; float:left;">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
-                            <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-1.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
-                            </a>
-                        </div>
-                    </div>
-                    <div style="width:70%;float:left;">
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
-                         <a href="https://www.cybrosys.com/odoo/industries/best-trading-erp/" target="_blank">
-                        Trading
-                         </a>
-                     </h3>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        Easily procure and sell your products.
-                     </h3>
-                        </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>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
-                            <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
+                    style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-2.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="assets/icons/license.png" class="img-responsive" height="48px" width="48px">
-                            </a>
+                </div>
-                        </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
-                    </div>
+                    Odoo
-                    <div style="width:70%;float:left;">
+                    Licensing Consultancy</h6>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+            </div>
-                        <a href="https://www.cybrosys.com/odoo/industries/manufacturing-erp-software/" target="_blank">
+        </div>
-                            Manufacturing</a>
+    </section>
-                     </h3>
+    <!-- END OF END OF OUR SERVICES -->
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        Plan, track and schedule your operations.
-                     </h3>
-                        </div>
 
+    <!-- OUR INDUSTRIES -->
+    <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">
+                <h2 style="color: #212529 !important;">Our Industries</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-3.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Trading
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/restaurant-management/" target="_blank">
+                        Easily procure
-                            Restaurant</a>
+                        and
-                     </h3>
+                        sell your products</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Run your bar or restaurant methodical.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-4.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/education-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Education
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/pos/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            POS</a>
+                        A platform for
-                     </h3>
+                        educational management</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Easy configuring and convivial selling.
+            </div>
-                     </h3>
-                        </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/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 style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-5.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        E-commerce &amp; Website
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 0px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
+                        Mobile
-                            E-commerce & Website</a>
+                        friendly,
-                     </h3>
+                        awe-inspiring product pages</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Mobile friendly, awe-inspiring product pages.
-                     </h3>
-                    </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-6.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/service-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Service Management
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/hotel-management-erp/" target="_blank">
+                        Keep track of
-                            Hotel Management</a>
+                        services and invoice</p>
-                     </h3>
+                </div>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
-                        An all-inclusive hotel management application.
-                     </h3>
-                        </div>
             </div>
-            <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-7.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px"
-                            </a>
+                        width="48px">
-                        </div>
+                    <h5
-                    </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    <div style="width:70%;float:left;">
+                        Restaurant
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    </h5>
-                        <a href="https://www.cybrosys.com/odoo/industries/education-erp-software/" target="_blank">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                            Education</a>
+                        Run your bar or
-                     </h3>
+                        restaurant methodically</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        A Collaborative platform for educational management.
-                     </h3>
-                        </div>
             </div>
-             <div style="flex-basis: 32%;padding-top: 20px;">
 
-                    <div style="width:30%; float:left;">
+            <div class="col-lg-3">
-                        <div style="width:75px;height:75px;background:#CE2D48; border-radius:100%;float: left;text-align: left;">
+                <div class="my-4 d-flex flex-column justify-content-center"
-                            <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-8.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
+                    <img src="./assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px">
-                            </a>
+                    <h5
-                        </div>
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
-                    </div>
+                        Hotel Management
-                    <div style="width:70%;float:left;">
+                    </h5>
-                     <h3 class="oe_slogan" style=" text-align: left;font-size: 14px;font-weight:800;width: auto;margin: 0;margin-top: 14px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 4px;margin-left: 16px;">
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
-                        <a href="https://www.cybrosys.com/odoo/industries/service-management/" target="_blank">
+                        An
-                            Service Management</a>
+                        all-inclusive
-                     </h3>
+                        hotel management application</p>
-                    <h3 class="oe_slogan" style=" text-align: left;font-size: 13px;width: auto;margin: 0;margin-top:5px;color: #000 !important;margin-top: 5px;opacity: 1 !important;line-height: 17px;float: left;margin-top: 5px;margin-left: 16px;">
+                </div>
-                        Keep track of services and invoice accordingly.
-                     </h3>
-                        </div>
             </div>
+
         </div>
-    </div>
+    </section>
-</section>
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-footer-bg.png); background-repeat:no-repeat; background-size:100%;padding: 13% 0% 6% 0%;">
-    <div class="oe_slogan" style="margin-top:10px !important;margin-bottom: 0px;">
-        <div>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="mailto:odoo@cybrosys.com"><i class="fa fa-envelope"></i> Email us </a>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-phone"></i> Contact Us </a>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-check-square"></i> Request Customization </a>
-        </div>
-        <br>
-        <img src="https://www.cybrosys.com/images/logo.png" style="width: 190px; margin-bottom: 25px;margin-top: 30px;" class="center-block">
-        <div>
-          <a href="https://twitter.com/cybrosys" target="_blank"><i class="fa fa-2x fa-twitter" style="color:white;background: #00a0d1;width:35px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://www.linkedin.com/company/cybrosys-technologies-pvt-ltd" target="_blank"><i class="fa fa-2x fa-linkedin" style="color:white;background: #31a3d6;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://www.facebook.com/cybrosystechnologies" target="_blank"><i class="fa fa-2x fa-facebook" style="color:white;background: #3b5998;width:35px; ;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://plus.google.com/106641282743045431892/about" target="_blank"><i class="fa fa-2x fa-google-plus" style="color:white;background: #c53c2c;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://in.pinterest.com/cybrosys" target="_blank"><i class="fa fa-2x fa-pinterest" style="color:white;background: #ac0f18;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-        </div>
-    </div>
-</section>
 
+    <!-- END OF END OF OUR INDUSTRIES -->
 
+    <!-- FOOTER -->
+    <!-- Footer Section -->
+    <section class="container" style="margin: 5rem auto 2rem;">
+        <div class="row" style="max-width:1540px;">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
+                <h2 style="color: #212529 !important;">Need Help?</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
+            </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>WhatsApp</a>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+        <!-- End of Contact Cards -->
+    </section>
+    <!-- Footer -->
+    <section class="oe_container" style="padding: 2rem 3rem 1rem;">
+        <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 class="col-lg-12">
+                <hr
+                    style="margin-top: 3rem;background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(229,229,229,1) 33%, rgba(229,229,229,1) 58%, rgba(0,212,255,0) 100%); height: 2px; border-style: none;">
+                <!-- End of Footer Section -->
+            </div>
+        </div>
+    </section>
+    <!-- END OF FOOTER -->
 
+</div>