[UPDT] Index Updated

bom_components_image/static/description/index.html

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

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="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="font-size: 35px;color: #fff;font-weight: 900;text-transform: uppercase;text-align: left;margin: 0;margin-bottom: 16px;">
-            CRM Kanban Drag Back
-        </h2>
-        <h3 class="oe_slogan" style="font-size: 25px;color: #fff;font-weight: 600;text-align: left;opacity: 1;margin: 0 !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>
-</section>
-
-<section class="oe_container" style="padding: 1% 0% 3% 15%;">
-    <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-            Overview
-        </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: 24px;">
-            This module restricts some users to drag leads backwards in sales pipeline without permission.
-        </h3>
-    </div>
-</section>
-
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-banner.png); background-repeat:no-repeat; background-size:cover;padding: 19% 0% 30% 15%;">
-    <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-             Features
-        </h2>
-         <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-             Restricts some users to drag leads backwards in sales pipeline.
-         </h3>
-        <h3 class="oe_slogan" style="text-align: left;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 18px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-             Allows the administrator or head of the team to approve leads.
-         </h3>
-
-    </div>
-</section>
-
-<section class="oe_container" style="padding: 3% 0% 0% 15%;">
-    <div class="oe_row oe_spaced">
-        <h2 class="oe_slogan" style="text-align: left;font-size: 28px;font-weight: 600;margin: 0px !important;">
-            Screenshots
-        </h2>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-            Go to Configuration -> Stages, and set an 'order'(integer value) for each stage you want to use in the pipeline.
-            The drag back works based on this 'order' field value.
-        </h3>
-        <div class="oe_row oe_spaced">
-            <img src="cybrosys-kanban-dragback-2.png" alt="" style="width: 95%;"/>
-        </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-            Shows the leads that are in the 'Waiting for Approval' State
-         </h3>
-        <div class="oe_row oe_spaced">
-            <img src="cybrosys-kanban-dragback-3.png" alt="" style="width: 95%;"/>
-        </div>
-        <h3 class="oe_slogan" style="text-align: left;padding: 5% 0% 0% 0%;font-size: 16px;width: 90%;margin: 0;margin-top: 14px;color: #000 !important;opacity: 1 !important;line-height: 24px;">
-            <i class="fa fa-check-circle-o" style="width:40px; color:#07B700"></i>
-            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.
-         </h3>
-        <div class="oe_row oe_spaced">
-            <img src="cybrosys-kanban-dragback-5.png" alt="" style="width: 95%;"/>
-        </div>
-    </div>
-</section>
-
-
-<section class="oe_container oe_dark">
-    <h2 class="oe_slogan">Need Any Help?</h2>
-    <div class="oe_slogan">
-        <a  class="btn btn-primary btn-lg mt8"
-            style="color: #FFFFFF !important;" href="http://www.cybrosys.com"><i
-            class="fa fa-envelope"></i> Email </a> <a
-            class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;"
-            href="http://www.cybrosys.com/contact/"><i
-            class="fa fa-phone"></i> Contact Us </a> <a
-            class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;"
-            href="http://www.cybrosys.com/odoo-customization-and-installation/"><i
-            class="fa fa-check-square"></i> Request Customization </a>
-    </div>
-</section>
-
-<section class="oe_container" style="padding: 7px 0% 0% 3%;">
-     <div class="oe_row oe_spaced">
-         <a style="color: #080808 !important;" href="https://apps.odoo.com/apps/modules/browse?search=cybrosys" target="_blank"><img src="https://www.cybrosys.com/images/view-more-apps.jpg" alt="cybrosys technologies" style="width: 100%;margin-bottom: 50px;"/></a>
-     </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 Services
-        </h2>
-        <div style="display:flex;padding-top: 20px;justify-content: space-between;">
-            <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-customization-and-installation/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-customization.png" style="width: 100%;border-radius: 100%;"/>
-                            </a>
-                    </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;">
-                         <a href="https://www.cybrosys.com/odoo-customization-and-installation/" target="_blank">
-                        Odoo Customization
-                         </a>
-                     </h3>
-
-            </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-implementation/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-erp-implementation.png" style="width: 100%;border-radius: 100%;"/>
-                        </a>
-                </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;">
-                    <a href="https://www.cybrosys.com/odoo-erp-implementation/" target="_blank">
-                        Odoo Implementation </a>
-                 </h3>
-
-            </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-integration/" target="_blank">
-                        <img src="https://www.cybrosys.com/images/odoo-erp-integration.png" style="width: 100%;border-radius: 100%;"/>
-                    </a>
-                </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;">
-                    <a href="https://www.cybrosys.com/odoo-erp-integration/" target="_blank">
-                        Odoo Integration
-                    </a>
-                 </h3>
-
-            </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">
-                            <img src="https://www.cybrosys.com/images/odoo-erp-support.png" style="width: 100%;border-radius: 100%;"/>
-                        </a>
-                </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;">
-                    <a href="https://www.cybrosys.com/odoo-erp-support/" target="_blank">
-                        Odoo Support</a>
-                 </h3>
-
-            </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">
-                            <img src="https://www.cybrosys.com/images/hire-odoo-developer.png" style="width: 100%;border-radius: 100%;"/>
-                        </a>
-                </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;">
-                    <a href="https://www.cybrosys.com/hire-odoo-developer/" target="_blank">
-                        Hire Odoo Developers</a>
-                 </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>
-            <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/manufacturing-erp-software/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-2.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/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>
-            <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/restaurant-management/" target="_blank">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-3.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/restaurant-management/" target="_blank">
-                            Restaurant</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;">
-                        Run your bar or restaurant methodical.
-                     </h3>
-                        </div>
-
-            </div>
-            <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/pos/" target="_blank">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-4.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/pos/" target="_blank">
-                            POS</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;">
-                        Easy configuring and convivial selling.
-                     </h3>
-                        </div>
-
-            </div>
-            <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/ecommerce-website/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-5.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: 0px;margin-left: 16px;">
-                        <a href="https://www.cybrosys.com/odoo/industries/ecommerce-website/" target="_blank">
-                            E-commerce & Website</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;">
-                        Mobile friendly, awe-inspiring product pages.
-                     </h3>
-                    </div>
-            </div>
-            <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/hotel-management-erp/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-6.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/hotel-management-erp/" target="_blank">
-                            Hotel Management</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;">
-                        An all-inclusive hotel management application.
-                     </h3>
-                        </div>
-            </div>
-            <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/education-erp-software/" target="_blank">
-                            <img src="https://www.cybrosys.com/images/odoo-index-industry-7.png" alt="Odoo Industry" style="    border-radius: 100%;width:100%;"/>
-                            </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/education-erp-software/" target="_blank">
-                            Education</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;">
-                        A Collaborative platform for educational management.
-                     </h3>
-                        </div>
-            </div>
-             <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/service-management/" target="_blank">
-                                <img src="https://www.cybrosys.com/images/odoo-index-industry-8.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/service-management/" target="_blank">
-                            Service Management</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;">
-                        Keep track of services and invoice accordingly.
-                     </h3>
-                        </div>
-            </div>
-        </div>
-    </div>
-</section>
-<section class="oe_container" style="background-image:url(https://www.cybrosys.com/images/odoo-index-footer-bg.png); background-repeat:no-repeat; background-size:100%;padding: 13% 0% 6% 0%;">
-    <div class="oe_slogan" style="margin-top:10px !important;margin-bottom: 0px;">
-        <div>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="mailto:odoo@cybrosys.com"><i class="fa fa-envelope"></i> Email us </a>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-phone"></i> Contact Us </a>
-            <a style="color: #5c5c5c !important;border-radius: 0;background: none;border: none;background: #fff;box-shadow: 0 10px 40px 0 rgba(62,57,107,0.07), 0 2px 9px 0 rgba(62, 57, 107, 0.05);border-radius: 30px;font-size: 12px;padding: 9px 26px;margin-right: 9px;width: 200px;text-transform: capitalize;" class="btn btn-primary btn-lg mt8" style="color: #FFFFFF !important;border-radius: 0;" href="https://www.cybrosys.com/contact/"><i class="fa fa-check-square"></i> Request Customization </a>
-        </div>
-        <br>
-        <img src="https://www.cybrosys.com/images/logo.png" style="width: 190px; margin-bottom: 25px;margin-top: 30px;" class="center-block">
-        <div>
-          <a href="https://twitter.com/cybrosys" target="_blank"><i class="fa fa-2x fa-twitter" style="color:white;background: #00a0d1;width:35px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://www.linkedin.com/company/cybrosys-technologies-pvt-ltd" target="_blank"><i class="fa fa-2x fa-linkedin" style="color:white;background: #31a3d6;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://www.facebook.com/cybrosystechnologies" target="_blank"><i class="fa fa-2x fa-facebook" style="color:white;background: #3b5998;width:35px; ;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://plus.google.com/106641282743045431892/about" target="_blank"><i class="fa fa-2x fa-google-plus" style="color:white;background: #c53c2c;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-          <a href="https://in.pinterest.com/cybrosys" target="_blank"><i class="fa fa-2x fa-pinterest" style="color:white;background: #ac0f18;width:35px;padding-left: 3px;height: 35px;padding-top: 7px;font-size: 21px;margin-right: 6px;border-radius: 100%;"></i></a></td>
-        </div>
-    </div>
-</section>
-
-
-
-
+<div class="container" style="padding: 1rem !important; margin-bottom: 1rem !important;">
+    <div class="row">
+        <div class="col-sm-12 col-md-12 col-lg-12 d-flex justify-content-between"
+            style="border-bottom: 1px solid #d5d5d5;">
+            <div class="my-3">
+                <img src="./assets/icons/logo.png" style="width: auto !important; height: 40px !important;">
+            </div>
+            <div class="my-3 d-flex align-items-center">
+                <div
+                    style="background-color: #7C7BAD !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Community
+                </div>
+                <div
+                    style="background-color: #875A7B !important; color: #fff !important; font-weight: 600 !important; padding: 5px 15px 8px !important; margin: 0 5px !important;">
+                    <i class="fa fa-check mr-1"></i>Enterprise
+                </div>
+
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="container" style="padding: 0rem 1.5rem 4rem !important">
+    <div class="row" style="height: 900px !important;">
+        <div class="col-sm-12 col-md-12 col-lg-12"
+            style="padding: 4rem 1rem !important; background-color: #714B67 !important; height: 600px !important; border-radius: 20px !important;">
+            <h1
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #FFFFFF !important;  font-size: 3.5rem !important; text-align: center !important;">
+                CRM Kanban Drag Back Permission</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;">
+                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>
+
+
+    <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>
+
+
+    <div class="row" id="features">
+        <div class="col-md-12" style="border-bottom: 1px solid #d5d5d5 !important; margin: 2rem 0 !important">
+            <h2
+                style="font-family: 'Montserrat', sans-serif !important; font-weight: 600 !important; color: #714B67 !important; font-size: 1.5rem !important;">
+                <i class="fa fa-star mr-2"></i>Features
+            </h2>
+        </div>
+
+        <div class="col-md-6 pl-3 py-3 d-flex">
+            <div>
+                <img src="assets/icons/check.png">
+            </div>
+            <div>
+                <h4
+                    style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                    Restricts some users to drag leads backwards in sales pipeline</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;">
+                    Allows the administrator or head of the team to approve leads</h4>
+
+            </div>
+        </div>
+
+    </div>
+
+    <div class="row" id="screenshots">
+        <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-image mr-2"></i>Screenshots
+            </h2>
+        </div>
+        <div class="col-lg-12 my-2">
+            <h4 class="mt-2"
+                style="font-family: 'Roboto', sans-serif !important; font-weight: 600 !important; color: #282F33 !important; font-size: 1.3rem !important;">
+                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.</h4>
+
+            <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>
+
+
+    <!-- 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>
+                    <div class="carousel-item" style="min-height:0px">
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/base_account_budget/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/budget_image.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/shopify_odoo_connector/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/shopify_image.png">
+                                </div>
+                            </a>
+                        </div>
+                        <div class="col-xs-12 col-sm-4 col-md-4 mb16 mt16" style="float:left">
+                            <a href="https://apps.odoo.com/apps/modules/14.0/odoo11_magento2/" target="_blank">
+                                <div style="border-radius:10px">
+                                    <img class="img img-responsive center-block"
+                                        style="border-top-left-radius:10px; border-top-right-radius:10px"
+                                        src="./assets/modules/magento_image.png">
+                                </div>
+                            </a>
+                        </div>
+                    </div>
+                </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 class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #1dd1a1 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/cogs.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Customization</h6>
+            </div>
+
+            <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 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 class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #ffa801 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/user.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Hire
+                    Odoo
+                    Developer</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #54a0ff  !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/puzzle.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Integration</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #6d7680 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/update.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Migration</h6>
+            </div>
+
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #786fa6 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/consultation.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Consultancy</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #f8a5c2 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/training.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <h6 class="text-center" style="font-family: Montserrat, 'sans-serif' !important; font-weight: bold;">
+                    Odoo
+                    Implementation</h6>
+            </div>
+
+            <div class="col-lg-4 d-flex flex-column justify-content-center align-items-center my-4">
+                <div class="d-flex justify-content-center align-items-center mx-3 my-3"
+                    style="background-color: #e6be26 !important; border-radius: 15px !important; height: 80px; width: 80px;">
+                    <img src="assets/icons/license.png" class="img-responsive" height="48px" width="48px">
+                </div>
+                <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 class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/trading-black.png" class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Trading
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Easily procure
+                        and
+                        sell your products</p>
+                </div>
+            </div>
+
+            <div class="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 class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/education-black.png" class="img-responsive mb-3" height="48px"
+                        width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Education
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        A platform for
+                        educational management</p>
+                </div>
+            </div>
+
+            <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 class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/ecom-black.png" class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        E-commerce &amp; Website
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Mobile
+                        friendly,
+                        awe-inspiring product pages</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/service-black.png" class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Service Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Keep track of
+                        services and invoice</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/restaurant-black.png" class="img-responsive mb-3" height="48px"
+                        width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Restaurant
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        Run your bar or
+                        restaurant methodically</p>
+                </div>
+            </div>
+
+            <div class="col-lg-3">
+                <div class="my-4 d-flex flex-column justify-content-center"
+                    style="background-color: #f6f8f9 !important; border-radius: 10px; padding: 2rem !important; height: 250px !important;">
+                    <img src="./assets/icons/hotel-black.png" class="img-responsive mb-3" height="48px" width="48px">
+                    <h5
+                        style="font-family: Montserrat, sans-serif !important; color: #000 !important; font-weight: bold;">
+                        Hotel Management
+                    </h5>
+                    <p style="font-family: Montserrat, sans-serif !important; font-size: 0.9rem !important;">
+                        An
+                        all-inclusive
+                        hotel management application</p>
+                </div>
+            </div>
+
+        </div>
+    </section>
+
+    <!-- END OF END OF OUR INDUSTRIES -->
+
+    <!-- FOOTER -->
+    <!-- Footer Section -->
+    <section class="container" style="margin: 5rem auto 2rem;">
+        <div class="row" style="max-width:1540px;">
+            <div class="col-lg-12 d-flex flex-column justify-content-center align-items-center">
+                <h2 style="color: #212529 !important;">Need Help?</h2>
+                <hr
+                    style="border: 3px solid #714B67 !important; background-color: #714B67 !important; width: 80px !important; margin-bottom: 2rem !important;" />
+            </div>
+        </div>
+
+        <!-- Contact Cards -->
+        <div class="row d-flex justify-content-center align-items-center"
+            style="max-width:1540px; margin: 0 auto 2rem auto;">
+
+            <div class="col-lg-12" style="padding: 0rem 3rem 2rem; border-radius: 10px; margin-right: 3rem; ">
+
+                <div class="row mt-4">
+                    <div class="col-lg-6">
+                        <a href="mailto:odoo@cybrosys.com" target="_blank" class="btn btn-block mb-2 deep_hover"
+                            style="text-decoration: none;  background-color: #4d4d4d; color: #FFF;  border-radius: 4px;"><i
+                                class="fa fa-envelope mr-2"></i>odoo@cybrosys.com</a>
+                    </div>
+                    <div class="col-lg-6">
+                        <a href="https://api.whatsapp.com/send?phone=918606827707" target="_blank"
+                            class="btn btn-block mb-2 deep_hover"
+                            style="text-decoration: none;  background-color: #25D366; color: #FFF;  border-radius: 4px;"><i
+                                class="fa fa-whatsapp mr-2"></i>WhatsApp</a>
+                    </div>
+                </div>
+            </div>
+
+        </div>
+        <!-- End of Contact Cards -->
+    </section>
+    <!-- Footer -->
+    <section class="oe_container" style="padding: 2rem 3rem 1rem;">
+        <div class="row" style="max-width:1540px; margin: 0 auto; margin-right: 3rem; ">
+            <!-- Logo -->
+            <div class="col-lg-12 d-flex justify-content-center align-items-center" style="margin-top: 3rem;">
+                <img src="https://www.cybrosys.com/images/logo.png" width="200px" height="auto" />
+            </div>
+            <!-- End of Logo -->
+            <div class="col-lg-12">
+                <hr
+                    style="margin-top: 3rem;background: linear-gradient(90deg, rgba(2,0,36,0) 0%, rgba(229,229,229,1) 33%, rgba(229,229,229,1) 58%, rgba(0,212,255,0) 100%); height: 2px; border-style: none;">
+                <!-- End of Footer Section -->
+            </div>
+        </div>
+    </section>
+    <!-- END OF FOOTER -->
+
+</div>

hr_employee_attendance/static/description/index.html

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