[UPDT] Index Updated

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;">
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
-             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;">
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
-             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>
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
-            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;">
+
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+        <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">
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+            <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>

project_status_level_report/static/description/index.html

@@ -1,388 +1,664 @@
-<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="oe_row oe_spaced">
+<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;">
-        <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="row">
-            Project Status Report
+        <div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between"
-        </h2>
+            style="border-bottom: 1px solid #d5d5d5;">
-        <h3 class="oe_slogan" style="font-size: 25px;color: #fff;font-weight: 600;text-align: left;opacity: 1;margin: 0 !important;">
+            <div class="my-3">
-            Graphical information of Project from various aspects.
+                <img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;">
-        </h3>
+            </div>
-        <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 class="my-3 d-flex align-items-center">
-            <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">Cybrosys Technologies</a>
+                <div
-        </h5>
+                    style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
-        <a style="color: #080808 !important;" href="https://www.cybrosys.com" target="_blank">
+                    <i class="fa fa-check mr-1"></i>Community
-            <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;"/>
+                <div
-            </div>
+                    style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
-        </a>
+                    <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;">
+                Project Status Report</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;">
+                Graphical representation of project from different aspects.
+            </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 class="col-md-6">
+            <a href="#video" 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;">
+                            Video</h3>
+                        <p
+                            style="font-family: 'Roboto', sans-serif !important; font-weight: 400 !important; color: #714B67 !important; font-size: 0.9rem !important;">
+                            Watch tutorial video on 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="row" id="overview">
-    <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
-            Overview
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-        </h2>
+                <i class="fa fa-pie-chart mr-2"></i>Overview
-        <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;">
+            </h2>
-            This Module Helps to Analyse Project in Various Aspects.It also provides the graphical information of project in these aspects.
+        </div>
-        </h3>
+
+        <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;">
+                Get more refined control of projects via analyzing them from different aspects. Project status report application helps the business to get a detailed visual of project status from various dimensions.Business organizations can make use of the application to plan,track and collaborate their task.</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: 19% 0% 30% 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
-             Features
+                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;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
+            </h2>
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+        </div>
-             Helps to Analyse Project in Various Aspects.
+
-         </h3>
+        <div class="col-md-6 pl-3 py-3 d-flex">
-        <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>
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+                <img src="assets/icons/check.png">
-              Complete Project Status XLS Report with Budget Analysis.
+            </div>
-         </h3>
+            <div>
-        <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;">
+                <h4
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-              Tasks, Gantt chart XLS Analysis.
+                    Helps to analyse project from various aspects</h4>
-         </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>
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+        </div>
-              Project Breakdown Charter Analysis.
+        <div class="col-md-6 pl-3 py-3 d-flex">
-         </h3>
+            <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;">
+                    Complete project status report in XLS with budget analysis.</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;">
+                    Tasks, Gantt chart XLS Analysis</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;">
+                    Project Breakdown Charter Analysis</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;">
+        </div>
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+        <div class="col-lg-12 my-2">
-            Menu View
+            <h4 class="mt-2"
-            </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">
+                Menu View</h4>
-            <img src="project-satus-level-cybrosys-1.png" alt="" style="width: 95%;"/>
+          
+            <img src="assets/screenshots/project_status_level_report-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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+        <div class="col-lg-12 my-3">
-            Wizard View
+            <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">
+                Wizard View</h4>
-            <img src="project-satus-level-cybrosys-2.png" alt="" style="width: 95%;"/>
+            
+            <img src="assets/screenshots/project_status_level_report-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;">
+                Project Graphical Overview</h4>
+            
+            <img src="assets/screenshots/project_status_level_report-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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+
-            Project Graphical Overview
+        <div class="col-lg-12 my-3">
-        </h3>
+            <h4 class="mt-3"
-        <div class="oe_row oe_spaced">
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-            <img src="project-satus-level-cybrosys-3.png" alt="" style="width: 95%;"/>
+                Project Information</h4>
+            
+            <img src="assets/screenshots/project_status_level_report-4.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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+
-           Project Informations
+        <div class="col-lg-12 my-3">
-        </h3>
+            <h4 class="mt-3"
-        <div class="oe_row oe_spaced">
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-            <img src="project-satus-level-cybrosys-4.png" alt="" style="width: 95%;"/>
+                The pie chart of overall task status.</h4>
+           
+            <img src="assets/screenshots/project_status_level_report-5.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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+
-            The pie chart of Overall task status.
+        <div class="col-lg-12 my-3">
-        </h3>
+            <h4 class="mt-3"
-        <div class="oe_row oe_spaced">
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-            <img src="project-satus-level-cybrosys-5.png" alt="" style="width: 95%;"/>
+                End user can easily compare the actual and planned time of the project</h4>
+            
+            <img src="assets/screenshots/project_status_level_report-6.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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+        <div class="col-lg-12 my-3">
-            End user can easily compare the actual and planned time the Project.
+            <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">
+                Project task information and bar chart. End user can easily analyse the tasks</h4>
-            <img src="project-satus-level-cybrosys-6.png" alt="" style="width: 95%;"/>
+            
+            <img src="assets/screenshots/project_status_level_report-7.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;">
+
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+
-            To compare the actual and planned budget of the Project.
+
-        </h3>
+    </div>
-        <div class="oe_row oe_spaced">
+
-            <img src="project-satus-level-cybrosys-7.png" alt="" style="width: 95%;"/>
+    <div class="row" id="video">
+        <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-film mr-2"></i>Video
+            </h2>
         </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-12 d-flex justify-content-center">
-           <img src="https://www.cybrosys.com/images/ico-tick.png">
+            <div class="s_panel_video" data-video-id="PF3WHX84fig">
-            Project task information and the bar chart are there. End user can easily Analysed the Tasks.
+                <img class="img-fluid s_tooltip_tabs_tooltip_image s_figure_link pb0"
-        </h3>
+                    src="assets/screenshots/project_status_level_report.png" alt="Cybrosys Cover Video"
-        <div class="oe_row oe_spaced">
+                    style="max-width:100%">
-            <img src="project-satus-level-cybrosys-8.png" alt="" style="width: 95%;"/>
+            </div>
         </div>
     </div>
-</section>
+
-
+    <!-- SUGGESTED PRODUCTS -->
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
+    <div class="row">
-     <div class="oe_row oe_spaced">
+        <div class="col-lg-12 d-flex flex-column justify-content-center"
-         <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>
+            style="text-align: center; padding: 2.5rem 1rem !important;">
-     </div>
+            <h2 style="color: #212529 !important;">Suggested Products</h2>
-</section>
+            <hr
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
+                style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
-    <div class="oe_row oe_spaced">
+
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
-            Our Services
+                <!-- The slideshow -->
-        </h2>
+                <div class="carousel-inner">
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
+                    <div class="carousel-item active" style="min-height:0px">
-            <div style="flex-basis: 18%;">
+                        <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/export_stockinfo_xls/" target="_blank">
-                    <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+                                <div style="border-radius:10px">
-                            <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+                                    <img class="img img-responsive center-block"
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
+                                        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 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%;">
+    <!-- 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>

project_time_spend/static/description/index.html

@@ -1,338 +1,558 @@
-<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"
-          Task Time Spend
+            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;">
-          Calculates the time spend based on start date and deadline for every one hour
-        </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="oe_row oe_spaced">
+<div class="container" style="padding: 0rem 1.5rem 4rem !important">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+    <div class="row" style="height: 900px !important;">
-            Overview
+        <div class="col-sm-12 col-md-12 col-lg-12"
-        </h2>
+            style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !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;">
+            <h1
-           The module helps to calculate the time spend for the specific task based on start date and deadline for every one hour until the stage becomes Done. And will shows the progressbar in tree view and form view.
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important;  font-size: 3.5rem !important; text-align: center !important;">
-        </h3>
+                Task Statusbar</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;">
+                Calculates the time spend based on start date and deadline for every one hour
+            </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: 5% 0% 15% 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">
-             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-pie-chart mr-2"></i>Overview
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+            </h2>
-            Calculate the time spend for the specific task
+        </div>
-         </h3>
+
+        <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;">
+                The module helps to calculate the time spend for the specific task based on start date and deadline
+                for every one hour until the stage becomes Done. And will shows the progressbar in tree view and
+                form view.</p>
+
+        </div>
     </div>
-</section>
+
-<section class="oe_container" style="padding: 3% 0% 0% 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">
-            Screenshots
+            <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;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-star mr-2"></i>Features
-            <img src="https://www.cybrosys.com/images/ico-tick.png">
+            </h2>
-          Go to Project -> Task. And then create Task by specifying start date and deadline.
-         </h3>
-        <div class="oe_row oe_spaced">
-            <img src="project-time-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><img src="https://www.cybrosys.com/images/ico-tick.png">
+        <div class="col-md-6 pl-3 py-3 d-flex">
-            Tree View
+            <div>
+                <img src="assets/icons/check.png">
             </div>
-        </h3>
+            <div>
-        <div class="oe_row oe_spaced">
+                <h4
-            <img src="project-time-cybrosys-2.png" alt="" style="width: 95%;"/>
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-        </div>
+                    Calculate the time spend for the specific task</h4>
-         <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><img src="https://www.cybrosys.com/images/ico-tick.png">
-            Form View
             </div>
-        </h3>
-        <div class="oe_row oe_spaced">
-            <img src="project-time-cybrosys-3.png" alt="" style="width: 95%;"/>
         </div>
+
     </div>
-</section>
+
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
+    <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">
-         <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>
+            <h2
-     </div>
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
-</section>
+                <i class="fa fa-image mr-2"></i>Screenshots
-<section class="oe_container" style="padding: 1% 0% 0% 3%;">
+            </h2>
-    <div class="oe_row oe_spaced">
+        </div>
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
+        <div class="col-lg-12 my-2">
-            Our Services
+            <h4 class="mt-2"
-        </h2>
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
+                Go to Project -> Task. And then create Task by specifying start date and deadline</h4>
-            <div style="flex-basis: 18%;">
+
-
+            <img src="assets/screenshots/project_time_spend-1.png" class="img-responsive img-thumbnail border"
-                    <div style="width:75px;height:75px;background:#fff; border-radius:100%;margin: auto;">
+                width="100%" height="auto" />
-                            <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
+        </div>
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
+
+        <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;">
+                Tree View</h4>
+
+            <img src="assets/screenshots/project_time_spend-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;">
+                Form View</h4>
+
+            <img src="assets/screenshots/project_time_spend-3.png" class="img-responsive img-thumbnail border"
+                width="100%" height="auto" />
+        </div>
+
+
+    </div>
+
+
+
+    <!-- SUGGESTED PRODUCTS -->
+    <div class="row">
+        <div class="col-lg-12 d-flex flex-column justify-content-center"
+            style="text-align: center; padding: 2.5rem 1rem !important;">
+            <h2 style="color: #212529 !important;">Suggested Products</h2>
+            <hr
+                style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
+
+            <div id="demo1" class="row carousel slide" data-ride="carousel">
+                <!-- The slideshow -->
+                <div class="carousel-inner">
+                    <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">
+                            <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>
-                     <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 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%;">
+    <!-- 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>