You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

996 lines
46 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>app index</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" />
<style>
:root {
--primary-color: #F5C000;
--bg-white: #fff;
--text-color: #121212;
--text-color-light: #64728f;
}
body {
font-family: "Montserrat", sans-serif;
}
</style>
</head>
<body>
<!-- overview -->
<div class="container">
<!-- support-header -->
<div class="supports my-5 py-3" style="border-bottom: 1px solid #e7e7e7;">
<div class="row justify-content-between">
<div class="col-4">
<div class="my-3">
<img src="//apps.odoocdn.com/apps/assets/17.0/theme_boec/images/Cybrosys.png?fcdde35"
style="width:auto !important; height:40px !important">
</div>
</div>
<div class="col-6">
<div class="row" style="margin-top:10px">
<div class="my-3 d-flex align-items-center justify-content-end">
<span class="me-3"><b>Supports: </b></span>
<div class="text-center"
style="background-color:#017E84 !important; font-size:0.8rem !important; color:#fff !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:50px !important; min-width:120px !important">
Community
</div>
</div>
</div>
<div class="row" style="margin-top:10px">
<div class="d-flex align-items-center justify-content-end">
<span class="me-3"><b>Availability: </b></span>
<div class="text-center col"
style="border:1px solid #017E84; font-size:0.8rem !important; color:#017E84 !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-times" style="color:red"></i> Odoo Online
</div>
<div class="text-center col"
style="font-size:0.8rem !important; border:1px solid #714b67; color:#714b67 !important; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-times" style="color:red"></i> Odoo.sh
</div>
<div class="text-center col"
style="font-size:0.8rem !important; color:#5B899E !important; border:1px solid #5B899E; font-weight:500 !important; padding:4px !important; margin:0 3px !important; border-radius:20px !important; min-width:120px !important">
<i class="fa fa-check" style="color: green;"></i> On Premise
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<!-- banner-section -->
<div class="my-5">
<div class="">
<img src="./img/banner-image.jpg" class="img-fluid" style="border-radius: 16px;width: 100%;">
</div>
</div>
<!-- -->
<!-- widgets-features -->
<!--feature section -->
<div class="my-5" style="padding: 100px; background-color: #f1f5fd; border-radius: 16px;">
<div class="container">
<div class="row mb-60">
<div class="col-lg-12 d-flex justify-content-center align-items-center flex-wrap gap-3">
<div class="position-relative" ; style="
text-align: center;
font-size: 46.875px;
font-style: normal;
padding-bottom: 40px; ">
<h2 style="font-weight: 600;">Our Features</h2>
<p style="color: #999;
text-align: center;
font-size: 15.625px;
font-style: normal;
font-weight: 400;
line-height: 25.6px;"></p>
</div>
</div>
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6" style="visibility: visible;">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;">Modified Structure for All Type Views</a></h4>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff; height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;">New Style for Active Menus, Header, Footer.</a></h4>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff; height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;">New Color Combination</a></h4>
</div>
</a>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;">New Look for Contact Us page, shops.</a></h4>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6">
<div style="background-color: #fff;height: 100%;
border-radius: 12px;
padding: 35px 30px;">
<div class="content">
<img src="./img/feature-star.svg" class="img-responsive" height="46px" width="46px">
<h4 class="mt-3"><a href="#" style=" color: #121212;
font-size: 18px;
text-decoration: none;
font-weight: 700;
line-height: 1.2;">A Clean layout and New Font Style.</a></h4>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- -->
<section class="container my-5">
<div class="row">
<div class="col-md-12">
<ul role="tablist" class="nav nav-tabs justify-content-center d-flex justify-content-center" data-tabs="tabs"
style="border:none; background-color:unset; margin:0 auto">
<li class="nav-item"
style="border-top-right-radius:10px; border-top-left-radius:10px; margin-right:10px; border:1px solid #D6E0FF; border-bottom:0">
<a href="#Features" data-bs-toggle="tab" aria-expanded="true" class="show"
style="text-transform:uppercase;display: block; font-weight:600; font-size:15px; letter-spacing:1px; padding:11px 20px; border-top-left-radius:10px;text-decoration: none; border-top-right-radius:10px; color:#2b2b2b; border:1px solid transparent">
Features</a>
</li>
<li class="nav-item"
style="border-top-right-radius:10px; border-top-left-radius:10px; margin-right:10px; border:1px solid #D6E0FF; border-bottom:0">
<a href="#Screenshot" data-bs-toggle="tab" aria-expanded="true" class="show"
style="text-transform:uppercase;display: block; font-weight:600; font-size:15px; letter-spacing:1px; padding:11px 20px; border-top-left-radius:10px;text-decoration: none; border-top-right-radius:10px; color:#2b2b2b; border:1px solid transparent">
Screenshot
</a>
</li>
</ul>
</div>
<div class="col-md-12 tab-content ui-front"
style="border-radius:20px;border: 1px solid #D6E0FF; height:auto;padding: 20px;">
<div class="tab-pane fade" id="Screenshot" role="tabpanel" aria-labelledby="screenshot-1">
<div class="row" style="padding:4rem 2.5rem 0 !important; background-color:#fff !important">
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;padding-bottom: 0px;">
<span class="label" style="font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #212121;
margin-bottom: 13px;
text-transform: uppercase;">SETTINGS</span>
<div class="mt-3" style="border-radius: 6px 6px 0px 0px;overflow: hidden;">
<img src="img/5.png" class="img-fluid" alt="">
</div>
</section>
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;padding-bottom: 0px;">
<span class="label" style="font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #212121;
margin-bottom: 13px;
text-transform: uppercase;">Apps</span>
<div class="mt-3" style="border-radius: 6px 6px 0px 0px;overflow: hidden;">
<img src="img/1.png" class="img-fluid" alt="">
</div>
</section>
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;padding-bottom: 0px;">
<span class="label" style="font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #212121;
margin-bottom: 13px;
text-transform: uppercase;">KANBAN VIEW</span>
<div class="mt-3" style="border-radius: 6px 6px 0px 0px;overflow: hidden;">
<img src="img/2.png" class="img-fluid" alt="">
</div>
</section>
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;padding-bottom: 0px;">
<span class="label" style="font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #212121;
margin-bottom: 13px;
text-transform: uppercase;">TREE VIEW</span>
<div class="mt-3" style="border-radius: 6px 6px 0px 0px;overflow: hidden;">
<img src="img/3.png" class="img-fluid" alt="">
</div>
</section>
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;padding-bottom: 0px;">
<span class="label" style="font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #212121;
margin-bottom: 13px;
text-transform: uppercase;">FORM VIEW</span>
<div class="mt-3" style="border-radius: 6px 6px 0px 0px;overflow: hidden;">
<img src="img/7.png" class="img-fluid" alt="">
</div>
</section>
</div>
</div>
<div class="tab-pane active show fade" id="Features" role="tabpanel" aria-labelledby="features-1">
<section class="">
<section class="mt-5">
<div class="row" style="margin-bottom: 24px; padding: 10px;">
<div class="col-md-8">
<div style="border-radius: 10px; padding: 32px;
background-color: #303030;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Artify Backend Theme Settings</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">To improve your experience with Odoo the Artify backend theme provides a fully configurable theme settings menu.</p>
</div>
<div class="mt-5">
<img src="./img/5.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-4">
<div style="border-radius: 10px; padding: 32px;
background-color: #303030;
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Apps</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">Easly accessible apps where it reveals the apps menu on just a click. Moreover, its also fully customisable with Artify backend theme.</p>
</div>
<div class="mt-5">
<img src="./img/1.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
<!--row-2 -->
<div class="row" style="margin-bottom: 24px;">
<div class="col-md-6">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Responsive Layout</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">One of the critical highlights of the Artify backend theme is that it was genuinely responsive; moreover, it provides an efficient interface to manage a mobile device.</p>
</div>
<div class="mt-5">
<img src="./img/responsive-backend-theme.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-6">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Attractive User Interface</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">It provides fully attractive, and a elgant User Interface with completely customizability..</p>
</div>
<div class="mt-5">
<img src="./img/3.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
<!--row-3 -->
<div class="row" style="margin-bottom: 20px;">
<div class="col-md-4">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Custom Form view</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">Artify Backend theme provides a fully modified and colorful form view with the full view experience.</p>
</div>
<div class="mt-5">
<img src="./img/7.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
<!-- -->
<div class="col-md-8">
<div style="border-radius: 10px; padding: 32px;
background-color: rgba(48, 48, 48, 1);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px); height: 100%;">
<div class="info">
<span class="label" style="font-size: 12px;
font-style: normal;
font-weight: 700;
line-height: 32px;
color: #f14848;
margin-bottom: 13px;
text-transform: uppercase;">HIGHLIGHT</span>
<h3 class="text-white" style=" color: #fff;
font-size: 24px;
font-weight: 500;
line-height: 32px;
margin-bottom: 9px;">Custom Form view</h3>
<p class="des" style="color: #c7c7c7;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
margin-bottom: 0;">Artify Backend theme provides a fully modified and colorful form view with the full view experience.</p>
</div>
<div class=" mt-5" style="--aspect-ratioapt: 872/443;">
<img src="./img/4.png" alt="Grid item" class="img-fluid">
</div>
<a href="#" target="_blank" class="url_link" name="grid_popup"
aria-label="Url link label"><span></span></a>
</div>
</div>
</div>
<!-- -->
</section>
</section>
</div>
</div>
</div>
</section>
<!--sections -->
<!-- section content -->
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;">
<div class="row d-flex align-items-center">
<div class="col col-12 col-md-12 col-lg-6">
<div style="padding: 20px;">
<h4 class="" style="font-size: 46px;">
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Fully Responsive</span><br>
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Layout.</span>
</h4>
<div class="mt-4">
<p style="color: #444; font-size: 16px;
font-weight: 400;
line-height: 1.5;">Now take advantage of everything your dashboard has to offer even on the go. Our
design are now fully responsive, enabling you to view and manage everything from the comfort of your
mobile device.</p>
<ul class="d-flex flex-column gap-3 ms-0 ps-0 mt-4">
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Fully responsive</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Fly-out hamburger menu on the left</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Fits perfectly to all screen sizest</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Quick access menu at the bottom in discuss</span></li>
</ul>
</div>
</div>
</div>
<div class="col col-12 col-md-12 col-lg-6">
<div>
<div>
<img class="img-fluid" src="./img/responsive-backend-theme.png" style="
border-radius: 20px;
">
</div>
</div>
</div>
</div>
</section>
<!-- 2 -->
<section class=""
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;">
<div class="row d-flex align-items-center">
<div class="col col-12 col-md-12 col-lg-6">
<div>
<div>
<img class="img-fluid" src="./img/2.png" style="
border-radius: 20px;
">
</div>
</div>
</div>
<div class="col col-12 col-md-12 col-lg-6">
<div style="padding: 20px;">
<h4 class="" style="font-size: 46px;">
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Kanban View</span><br>
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Layout</span>
</h4>
<div class="mt-4">
<p style="color: #444; font-size: 16px;
font-weight: 400;
line-height: 1.5;">The Artify Backend Theme V18 Gives You a Fully Modified Kanban View and Kanban Group View. The Section Wise Separated Stages give a Pleasant Experience And an Extraordinary Design To Your Content Tiles, Making The Tiles Look Great. It will Give You a Clean Layout with the New Color Combination and a Modified Font.</p>
<ul class="d-flex flex-column gap-3 ms-0 ps-0 mt-4">
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Stages are Separated in View</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Color Combination</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Modified Font</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Clean Layout</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Buttons with New Colors</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Full Screen View</span></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="mb-5"
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;margin-top: 3rem;">
<div class="row d-flex align-items-center">
<div class="col col-12 col-md-12 col-lg-6">
<div style="padding: 20px;">
<h4 class="" style="font-size: 46px;">
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">List View</span><br>
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Layout</span>
</h4>
<div class="mt-4">
<p style="color: #444; font-size: 16px;
font-weight: 400;
line-height: 1.5;">Artify Backend Theme V18 Gives You The Fully Modified List View. This Table Design Gives You More Beauty for Your Odoo Backend. It will Give You a Clean Layout with the New Color Combination and a Modified Font.</p>
<ul class="d-flex flex-column gap-3 ms-0 ps-0 mt-4">
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">List View</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Stages are Separated in View</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Color Combination</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Modified Font</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Clean Layout</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Buttons with New Colors</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Full Screen View</span></li>
</ul>
</div>
</div>
</div>
<div class="col col-12 col-md-12 col-lg-6">
<div>
<div>
<img class="img-fluid" src="./img/6png.png" style="
border-radius: 20px;
">
</div>
</div>
</div>
</div>
</section>
<section class=""
style="background-color: #f1f5fd; border: 1px solid #D6E0FF; border-radius: 20px; padding: 40px;">
<div class="row d-flex align-items-center">
<div class="col col-12 col-md-12 col-lg-6">
<div>
<div>
<img class="img-fluid" src="./img/2.png" style="
border-radius: 20px;
">
</div>
</div>
</div>
<div class="col col-12 col-md-12 col-lg-6">
<div style="padding: 20px;">
<h4 class="" style="font-size: 46px;">
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Form View</span><br>
<span style="color: #212121;
font-weight: 700;
display: inline-block;
width: 100%;">Layout</span>
</h4>
<div class="mt-4">
<p style="color: #444; font-size: 16px;
font-weight: 400;
line-height: 1.5;">The Artify Backend Theme V18 Gives You a Fully Modified Kanban View and Kanban Group View. The Section Wise Separated Stages give a Pleasant Experience And an Extraordinary Design To Your Content Tiles, Making The Tiles Look Great. It will Give You a Clean Layout with the New Color Combination and a Modified Font.</p>
<ul class="d-flex flex-column gap-3 ms-0 ps-0 mt-4">
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Modified Form Style</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Style for Required Field</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">Full Screen Form View</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Chatter Style Under Form View</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Looks for Tabs</span></li>
<li style="list-style: none;" class="d-flex align-items-center gap-2"><img src="./img/check.svg"
style="width: 24px;"><span style=" color: #444;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 32px;">New Looks for Status Button</span></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- -->
<!-- -->
<div class="my-5">
<!-- banner card -->
<!-- service-section -->
<section id="services" class="mt-5" style="border-radius: 16px;
border: 1px solid #EBEEF2;
background-color: #FFF;
padding: 60px 40px;
box-shadow: 0px 5px 20px -11px rgba(0, 0, 0, 0.25);">
<div class="text-center mt-4">
<h3 class="mb-0" style="color: #000;
text-align: center;
font-family: Montserrat;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;
padding-bottom: 50px;">Our Services</h3>
</div>
<div class="row mt-3">
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#FFE2E5; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#FA5A7D; border-radius:50%; height:56px; width:56px">
<img src="./img/gear.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;"> Odoo Customization</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#FFF4DE; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#FF947A; border-radius:50%; height:56px; width:56px">
<img src="./img/wrench-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;"> Odoo Implementation</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#DCFCE7; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#3CD856; border-radius:50%; height:56px; width:56px">
<img src="./img/life-ring-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Odoo Support</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#F3E8FF; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#BF83FF; border-radius:50%; height:56px; width:56px">
<img src="./img/arrows-repeat.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Odoo Migration</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#F1F9FF; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#01649C; border-radius:50%; height:56px; width:56px">
<img src="./img/puzzle-piece-icon.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Odoo integration</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#EDF8ED; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#69CC70; border-radius:50%; height:56px; width:56px">
<img src="./img/odoo-consultancy.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Odoo Consultancy</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#F1F6FF; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#2E4556; border-radius:50%; height:56px; width:56px">
<img src="./img/odoo-licencing.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Odoo Licensing</span>
</div>
</a>
</div>
<div class="col-lg-3 col-sm-12 mb-3">
<a href="#" style="text-decoration:none">
<div class="btn-lg btn-block p-4 mb-2 d-flex flex-column justify-content-center align-items-center"
style="font-size:25px; font-weight:bold;background-color:#FAF6EA; margin:auto; border-radius: 8px;">
<div class="d-flex justify-content-center align-items-center"
style="background-color:#FCD12C; border-radius:50%; height:56px; width:56px">
<img src="./img/hire-odoo.svg" class="img-responsive" height="28px" width="28px">
</div>
<span class="mt-3" style="font-size: 18px;
color: #121212;
font-weight: 600;">Hire Odoo Developer</span>
</div>
</a>
</div>
</div>
<!-- -->
</div>
</div>
</section>
<!-- -->
</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
</html>