2025-04-02 13:24:56 +05:30

2381 lines
138 KiB
HTML

<!doctype html>
<html
lang="en"
class="light-style layout-menu-fixed layout-compact"
dir="ltr"
data-theme="theme-default"
data-assets-path="../../assets/"
data-template="horizontal-menu-template"
data-style="light">
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
<title>Demo : Custom Options - Forms | sneat - Bootstrap Dashboard PRO</title>
<meta name="description" content="" />
<!-- Favicon -->
<link rel="icon" type="image/x-icon" href="../../assets/img/favicon/favicon.ico" />
<!-- Fonts -->
<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=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
rel="stylesheet" />
<!-- Icons -->
<link rel="stylesheet" href="../../assets/vendor/fonts/boxicons.css" />
<link rel="stylesheet" href="../../assets/vendor/fonts/fontawesome.css" />
<link rel="stylesheet" href="../../assets/vendor/fonts/flag-icons.css" />
<!-- Core CSS -->
<link rel="stylesheet" href="../../assets/vendor/css/rtl/core.css" class="template-customizer-core-css" />
<link rel="stylesheet" href="../../assets/vendor/css/rtl/theme-default.css" class="template-customizer-theme-css" />
<link rel="stylesheet" href="../../assets/css/demo.css" />
<!-- Vendors CSS -->
<link rel="stylesheet" href="../../assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.css" />
<link rel="stylesheet" href="../../assets/vendor/libs/typeahead-js/typeahead.css" />
<!-- Page CSS -->
<!-- Helpers -->
<script src="../../assets/vendor/js/helpers.js"></script>
<!--! Template customizer & Theme config files MUST be included after core stylesheets and helpers.js in the <head> section -->
<!--? Template customizer: To hide customizer set displayCustomizer value false in config.js. -->
<script src="../../assets/vendor/js/template-customizer.js"></script>
<!--? Config: Mandatory theme config file contain global vars & default theme options, Set your preferred theme option in this file. -->
<script src="../../assets/js/config.js"></script>
</head>
<body>
<!-- Layout wrapper -->
<div class="layout-wrapper layout-navbar-full layout-horizontal layout-without-menu">
<div class="layout-container">
<!-- Navbar -->
<nav class="layout-navbar navbar navbar-expand-xl align-items-center bg-navbar-theme" id="layout-navbar">
<div class="container-xxl">
<div class="navbar-brand app-brand demo d-none d-xl-flex py-0 me-4">
<a href="index.html" class="app-brand-link gap-2">
<span class="app-brand-logo demo">
<svg
width="25"
viewBox="0 0 25 42"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path
d="M13.7918663,0.358365126 L3.39788168,7.44174259 C0.566865006,9.69408886 -0.379795268,12.4788597 0.557900856,15.7960551 C0.68998853,16.2305145 1.09562888,17.7872135 3.12357076,19.2293357 C3.8146334,19.7207684 5.32369333,20.3834223 7.65075054,21.2172976 L7.59773219,21.2525164 L2.63468769,24.5493413 C0.445452254,26.3002124 0.0884951797,28.5083815 1.56381646,31.1738486 C2.83770406,32.8170431 5.20850219,33.2640127 7.09180128,32.5391577 C8.347334,32.0559211 11.4559176,30.0011079 16.4175519,26.3747182 C18.0338572,24.4997857 18.6973423,22.4544883 18.4080071,20.2388261 C17.963753,17.5346866 16.1776345,15.5799961 13.0496516,14.3747546 L10.9194936,13.4715819 L18.6192054,7.984237 L13.7918663,0.358365126 Z"
id="path-1"></path>
<path
d="M5.47320593,6.00457225 C4.05321814,8.216144 4.36334763,10.0722806 6.40359441,11.5729822 C8.61520715,12.571656 10.0999176,13.2171421 10.8577257,13.5094407 L15.5088241,14.433041 L18.6192054,7.984237 C15.5364148,3.11535317 13.9273018,0.573395879 13.7918663,0.358365126 C13.5790555,0.511491653 10.8061687,2.3935607 5.47320593,6.00457225 Z"
id="path-3"></path>
<path
d="M7.50063644,21.2294429 L12.3234468,23.3159332 C14.1688022,24.7579751 14.397098,26.4880487 13.008334,28.506154 C11.6195701,30.5242593 10.3099883,31.790241 9.07958868,32.3040991 C5.78142938,33.4346997 4.13234973,34 4.13234973,34 C4.13234973,34 2.75489982,33.0538207 2.37032616e-14,31.1614621 C-0.55822714,27.8186216 -0.55822714,26.0572515 -4.05231404e-15,25.8773518 C0.83734071,25.6075023 2.77988457,22.8248993 3.3049379,22.52991 C3.65497346,22.3332504 5.05353963,21.8997614 7.50063644,21.2294429 Z"
id="path-4"></path>
<path
d="M20.6,7.13333333 L25.6,13.8 C26.2627417,14.6836556 26.0836556,15.9372583 25.2,16.6 C24.8538077,16.8596443 24.4327404,17 24,17 L14,17 C12.8954305,17 12,16.1045695 12,15 C12,14.5672596 12.1403557,14.1461923 12.4,13.8 L17.4,7.13333333 C18.0627417,6.24967773 19.3163444,6.07059163 20.2,6.73333333 C20.3516113,6.84704183 20.4862915,6.981722 20.6,7.13333333 Z"
id="path-5"></path>
</defs>
<g id="g-app-brand" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Brand-Logo" transform="translate(-27.000000, -15.000000)">
<g id="Icon" transform="translate(27.000000, 15.000000)">
<g id="Mask" transform="translate(0.000000, 8.000000)">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<use fill="#696cff" xlink:href="#path-1"></use>
<g id="Path-3" mask="url(#mask-2)">
<use fill="#696cff" xlink:href="#path-3"></use>
<use fill-opacity="0.2" fill="#FFFFFF" xlink:href="#path-3"></use>
</g>
<g id="Path-4" mask="url(#mask-2)">
<use fill="#696cff" xlink:href="#path-4"></use>
<use fill-opacity="0.2" fill="#FFFFFF" xlink:href="#path-4"></use>
</g>
</g>
<g
id="Triangle"
transform="translate(19.000000, 11.000000) rotate(-300.000000) translate(-19.000000, -11.000000) ">
<use fill="#696cff" xlink:href="#path-5"></use>
<use fill-opacity="0.2" fill="#FFFFFF" xlink:href="#path-5"></use>
</g>
</g>
</g>
</g>
</svg>
</span>
<span class="app-brand-text demo menu-text fw-bold text-heading">sneat</span>
</a>
<a href="javascript:void(0);" class="layout-menu-toggle menu-link text-large ms-auto d-xl-none">
<i class="d-flex align-items-center justify-content-center"></i>
</a>
</div>
<div class="layout-menu-toggle navbar-nav align-items-xl-center me-4 me-xl-0 d-xl-none">
<a class="nav-item nav-link px-0 me-xl-6" href="javascript:void(0)">
<i class="bx bx-menu bx-md"></i>
</a>
</div>
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
<ul class="navbar-nav flex-row align-items-center ms-auto">
<!-- Search -->
<li class="nav-item navbar-search-wrapper me-2 me-xl-0">
<a class="nav-link search-toggler" href="javascript:void(0);">
<i class="bx bx-search bx-md"></i>
</a>
</li>
<!-- /Search -->
<!-- Language -->
<li class="nav-item dropdown-language dropdown me-2 me-xl-0">
<a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown">
<i class="bx bx-globe bx-md"></i>
</a>
<ul class="dropdown-menu dropdown-menu-end">
<li>
<a class="dropdown-item" href="javascript:void(0);" data-language="en" data-text-direction="ltr">
<span>English</span>
</a>
</li>
<li>
<a class="dropdown-item" href="javascript:void(0);" data-language="fr" data-text-direction="ltr">
<span>French</span>
</a>
</li>
<li>
<a class="dropdown-item" href="javascript:void(0);" data-language="ar" data-text-direction="rtl">
<span>Arabic</span>
</a>
</li>
<li>
<a class="dropdown-item" href="javascript:void(0);" data-language="de" data-text-direction="ltr">
<span>German</span>
</a>
</li>
</ul>
</li>
<!-- /Language -->
<!-- Style Switcher -->
<li class="nav-item dropdown-style-switcher dropdown me-2 me-xl-0">
<a class="nav-link dropdown-toggle hide-arrow" href="javascript:void(0);" data-bs-toggle="dropdown">
<i class="bx bx-md"></i>
</a>
<ul class="dropdown-menu dropdown-menu-end dropdown-styles">
<li>
<a class="dropdown-item" href="javascript:void(0);" data-theme="light">
<span><i class="bx bx-sun bx-md me-3"></i>Light</span>
</a>
</li>
<li>
<a class="dropdown-item" href="javascript:void(0);" data-theme="dark">
<span><i class="bx bx-moon bx-md me-3"></i>Dark</span>
</a>
</li>
<li>
<a class="dropdown-item" href="javascript:void(0);" data-theme="system">
<span><i class="bx bx-desktop bx-md me-3"></i>System</span>
</a>
</li>
</ul>
</li>
<!-- / Style Switcher-->
<!-- Quick links -->
<li class="nav-item dropdown-shortcuts navbar-dropdown dropdown me-2 me-xl-0">
<a
class="nav-link dropdown-toggle hide-arrow"
href="javascript:void(0);"
data-bs-toggle="dropdown"
data-bs-auto-close="outside"
aria-expanded="false">
<i class="bx bx-grid-alt bx-md"></i>
</a>
<div class="dropdown-menu dropdown-menu-end p-0">
<div class="dropdown-menu-header border-bottom">
<div class="dropdown-header d-flex align-items-center py-3">
<h6 class="mb-0 me-auto">Shortcuts</h6>
<a
href="javascript:void(0)"
class="dropdown-shortcuts-add py-2"
data-bs-toggle="tooltip"
data-bs-placement="top"
title="Add shortcuts"
><i class="bx bx-plus-circle text-heading"></i
></a>
</div>
</div>
<div class="dropdown-shortcuts-list scrollable-container">
<div class="row row-bordered overflow-visible g-0">
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-calendar bx-26px text-heading"></i>
</span>
<a href="app-calendar.html" class="stretched-link">Calendar</a>
<small>Appointments</small>
</div>
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-food-menu bx-26px text-heading"></i>
</span>
<a href="app-invoice-list.html" class="stretched-link">Invoice App</a>
<small>Manage Accounts</small>
</div>
</div>
<div class="row row-bordered overflow-visible g-0">
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-user bx-26px text-heading"></i>
</span>
<a href="app-user-list.html" class="stretched-link">User App</a>
<small>Manage Users</small>
</div>
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-check-shield bx-26px text-heading"></i>
</span>
<a href="app-access-roles.html" class="stretched-link">Role Management</a>
<small>Permission</small>
</div>
</div>
<div class="row row-bordered overflow-visible g-0">
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-pie-chart-alt-2 bx-26px text-heading"></i>
</span>
<a href="index.html" class="stretched-link">Dashboard</a>
<small>User Dashboard</small>
</div>
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-cog bx-26px text-heading"></i>
</span>
<a href="pages-account-settings-account.html" class="stretched-link">Setting</a>
<small>Account Settings</small>
</div>
</div>
<div class="row row-bordered overflow-visible g-0">
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-help-circle bx-26px text-heading"></i>
</span>
<a href="pages-faq.html" class="stretched-link">FAQs</a>
<small>FAQs & Articles</small>
</div>
<div class="dropdown-shortcuts-item col">
<span class="dropdown-shortcuts-icon rounded-circle mb-3">
<i class="bx bx-window-open bx-26px text-heading"></i>
</span>
<a href="modal-examples.html" class="stretched-link">Modals</a>
<small>Useful Popups</small>
</div>
</div>
</div>
</div>
</li>
<!-- Quick links -->
<!-- Notification -->
<li class="nav-item dropdown-notifications navbar-dropdown dropdown me-3 me-xl-2">
<a
class="nav-link dropdown-toggle hide-arrow"
href="javascript:void(0);"
data-bs-toggle="dropdown"
data-bs-auto-close="outside"
aria-expanded="false">
<span class="position-relative">
<i class="bx bx-bell bx-md"></i>
<span class="badge rounded-pill bg-danger badge-dot badge-notifications border"></span>
</span>
</a>
<ul class="dropdown-menu dropdown-menu-end p-0">
<li class="dropdown-menu-header border-bottom">
<div class="dropdown-header d-flex align-items-center py-3">
<h6 class="mb-0 me-auto">Notification</h6>
<div class="d-flex align-items-center h6 mb-0">
<span class="badge bg-label-primary me-2">8 New</span>
<a
href="javascript:void(0)"
class="dropdown-notifications-all p-2"
data-bs-toggle="tooltip"
data-bs-placement="top"
title="Mark all as read"
><i class="bx bx-envelope-open text-heading"></i
></a>
</div>
</div>
</li>
<li class="dropdown-notifications-list scrollable-container">
<ul class="list-group list-group-flush">
<li class="list-group-item list-group-item-action dropdown-notifications-item">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<img src="../../assets/img/avatars/1.png" alt class="rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Congratulation Lettie 🎉</h6>
<small class="mb-1 d-block text-body">Won the monthly best seller gold badge</small>
<small class="text-muted">1h ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<span class="avatar-initial rounded-circle bg-label-danger">CF</span>
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Charles Franklin</h6>
<small class="mb-1 d-block text-body">Accepted your connection</small>
<small class="text-muted">12hr ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item marked-as-read">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<img src="../../assets/img/avatars/2.png" alt class="rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">New Message ✉️</h6>
<small class="mb-1 d-block text-body">You have new message from Natalie</small>
<small class="text-muted">1h ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<span class="avatar-initial rounded-circle bg-label-success"
><i class="bx bx-cart"></i
></span>
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Whoo! You have new order 🛒</h6>
<small class="mb-1 d-block text-body">ACME Inc. made new order $1,154</small>
<small class="text-muted">1 day ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item marked-as-read">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<img src="../../assets/img/avatars/9.png" alt class="rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Application has been approved 🚀</h6>
<small class="mb-1 d-block text-body"
>Your ABC project application has been approved.</small
>
<small class="text-muted">2 days ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item marked-as-read">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<span class="avatar-initial rounded-circle bg-label-success"
><i class="bx bx-pie-chart-alt"></i
></span>
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Monthly report is generated</h6>
<small class="mb-1 d-block text-body">July monthly financial report is generated </small>
<small class="text-muted">3 days ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item marked-as-read">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<img src="../../assets/img/avatars/5.png" alt class="rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">Send connection request</h6>
<small class="mb-1 d-block text-body">Peter sent you connection request</small>
<small class="text-muted">4 days ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<img src="../../assets/img/avatars/6.png" alt class="rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">New message from Jane</h6>
<small class="mb-1 d-block text-body">Your have new message from Jane</small>
<small class="text-muted">5 days ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
<li class="list-group-item list-group-item-action dropdown-notifications-item marked-as-read">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar">
<span class="avatar-initial rounded-circle bg-label-warning"
><i class="bx bx-error"></i
></span>
</div>
</div>
<div class="flex-grow-1">
<h6 class="small mb-0">CPU is running high</h6>
<small class="mb-1 d-block text-body"
>CPU Utilization Percent is currently at 88.63%,</small
>
<small class="text-muted">5 days ago</small>
</div>
<div class="flex-shrink-0 dropdown-notifications-actions">
<a href="javascript:void(0)" class="dropdown-notifications-read"
><span class="badge badge-dot"></span
></a>
<a href="javascript:void(0)" class="dropdown-notifications-archive"
><span class="bx bx-x"></span
></a>
</div>
</div>
</li>
</ul>
</li>
<li class="border-top">
<div class="d-grid p-4">
<a class="btn btn-primary btn-sm d-flex" href="javascript:void(0);">
<small class="align-middle">View all notifications</small>
</a>
</div>
</li>
</ul>
</li>
<!--/ Notification -->
<!-- User -->
<li class="nav-item navbar-dropdown dropdown-user dropdown">
<a
class="nav-link dropdown-toggle hide-arrow p-0"
href="javascript:void(0);"
data-bs-toggle="dropdown">
<div class="avatar avatar-online">
<img src="../../assets/img/avatars/1.png" alt class="w-px-40 h-auto rounded-circle" />
</div>
</a>
<ul class="dropdown-menu dropdown-menu-end">
<li>
<a class="dropdown-item" href="pages-account-settings-account.html">
<div class="d-flex">
<div class="flex-shrink-0 me-3">
<div class="avatar avatar-online">
<img src="../../assets/img/avatars/1.png" alt class="w-px-40 h-auto rounded-circle" />
</div>
</div>
<div class="flex-grow-1">
<h6 class="mb-0">John Doe</h6>
<small class="text-muted">Admin</small>
</div>
</div>
</a>
</li>
<li>
<div class="dropdown-divider my-1"></div>
</li>
<li>
<a class="dropdown-item" href="pages-profile-user.html">
<i class="bx bx-user bx-md me-3"></i><span>My Profile</span>
</a>
</li>
<li>
<a class="dropdown-item" href="pages-account-settings-account.html">
<i class="bx bx-cog bx-md me-3"></i><span>Settings</span>
</a>
</li>
<li>
<a class="dropdown-item" href="pages-account-settings-billing.html">
<span class="d-flex align-items-center align-middle">
<i class="flex-shrink-0 bx bx-credit-card bx-md me-3"></i
><span class="flex-grow-1 align-middle">Billing Plan</span>
<span class="flex-shrink-0 badge rounded-pill bg-danger">4</span>
</span>
</a>
</li>
<li>
<div class="dropdown-divider my-1"></div>
</li>
<li>
<a class="dropdown-item" href="pages-pricing.html">
<i class="bx bx-dollar bx-md me-3"></i><span>Pricing</span>
</a>
</li>
<li>
<a class="dropdown-item" href="pages-faq.html">
<i class="bx bx-help-circle bx-md me-3"></i><span>FAQ</span>
</a>
</li>
<li>
<div class="dropdown-divider my-1"></div>
</li>
<li>
<a class="dropdown-item" href="auth-login-cover.html" target="_blank">
<i class="bx bx-power-off bx-md me-3"></i><span>Log Out</span>
</a>
</li>
</ul>
</li>
<!--/ User -->
</ul>
</div>
<!-- Search Small Screens -->
<div class="navbar-search-wrapper search-input-wrapper container-xxl d-none">
<input
type="text"
class="form-control search-input border-0"
placeholder="Search..."
aria-label="Search..." />
<i class="bx bx-x bx-md search-toggler cursor-pointer"></i>
</div>
</div>
</nav>
<!-- / Navbar -->
<!-- Layout container -->
<div class="layout-page">
<!-- Content wrapper -->
<div class="content-wrapper">
<!-- Menu -->
<aside id="layout-menu" class="layout-menu-horizontal menu-horizontal menu bg-menu-theme flex-grow-0">
<div class="container-xxl d-flex h-100">
<ul class="menu-inner">
<!-- Dashboards -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-home-smile"></i>
<div data-i18n="Dashboards">Dashboards</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="dashboards-analytics.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-pie-chart-alt-2"></i>
<div data-i18n="Analytics">Analytics</div>
</a>
</li>
<li class="menu-item">
<a href="dashboards-crm.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-shape-circle"></i>
<div data-i18n="CRM">CRM</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-dashboard.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-cart-alt"></i>
<div data-i18n="eCommerce">eCommerce</div>
</a>
</li>
<li class="menu-item">
<a href="app-logistics-dashboard.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-car"></i>
<div data-i18n="Logistics">Logistics</div>
</a>
</li>
<li class="menu-item">
<a href="app-academy-dashboard.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-book-open"></i>
<div data-i18n="Academy">Academy</div>
</a>
</li>
</ul>
</li>
<!-- Layouts -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-layout"></i>
<div data-i18n="Layouts">Layouts</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="layouts-without-menu.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-menu"></i>
<div data-i18n="Without menu">Without menu</div>
</a>
</li>
<li class="menu-item">
<a href="../vertical-menu-template/" class="menu-link" target="_blank">
<i class="menu-icon tf-icons bx bx-vertical-center"></i>
<div data-i18n="Vertical">Vertical</div>
</a>
</li>
<li class="menu-item">
<a href="layouts-fluid.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-fullscreen"></i>
<div data-i18n="Fluid">Fluid</div>
</a>
</li>
<li class="menu-item">
<a href="layouts-container.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-exit-fullscreen"></i>
<div data-i18n="Container">Container</div>
</a>
</li>
<li class="menu-item">
<a href="layouts-blank.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-square-rounded"></i>
<div data-i18n="Blank">Blank</div>
</a>
</li>
</ul>
</li>
<!-- Apps -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-customize"></i>
<div data-i18n="Apps">Apps</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-email.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-envelope"></i>
<div data-i18n="Email">Email</div>
</a>
</li>
<li class="menu-item">
<a href="app-chat.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-chat"></i>
<div data-i18n="Chat">Chat</div>
</a>
</li>
<li class="menu-item">
<a href="app-calendar.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-calendar"></i>
<div data-i18n="Calendar">Calendar</div>
</a>
</li>
<li class="menu-item">
<a href="app-kanban.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-grid"></i>
<div data-i18n="Kanban">Kanban</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-cart-alt"></i>
<div data-i18n="eCommerce">eCommerce</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-dashboard.html" class="menu-link">
<div data-i18n="Dashboard">Dashboard</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Products">Products</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-product-list.html" class="menu-link">
<div data-i18n="Product List">Product List</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-product-add.html" class="menu-link">
<div data-i18n="Add Product">Add Product</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-category-list.html" class="menu-link">
<div data-i18n="Category List">Category List</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Order">Order</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-order-list.html" class="menu-link">
<div data-i18n="Order List">Order List</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-order-details.html" class="menu-link">
<div data-i18n="Order Details">Order Details</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Customer">Customer</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-customer-all.html" class="menu-link">
<div data-i18n="All Customers">All Customers</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Customer Details">Customer Details</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-customer-details-overview.html" class="menu-link">
<div data-i18n="Overview">Overview</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-customer-details-security.html" class="menu-link">
<div data-i18n="Security">Security</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-customer-details-billing.html" class="menu-link">
<div data-i18n="Address & Billing">Address & Billing</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-customer-details-notifications.html" class="menu-link">
<div data-i18n="Notifications">Notifications</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="menu-item">
<a href="app-ecommerce-manage-reviews.html" class="menu-link">
<div data-i18n="Manage Reviews">Manage Reviews</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-referral.html" class="menu-link">
<div data-i18n="Referrals">Referrals</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Settings">Settings</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-ecommerce-settings-detail.html" class="menu-link">
<div data-i18n="Store Details">Store Details</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-settings-payments.html" class="menu-link">
<div data-i18n="Payments">Payments</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-settings-checkout.html" class="menu-link">
<div data-i18n="Checkout">Checkout</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-settings-shipping.html" class="menu-link">
<div data-i18n="Shipping & Delivery">Shipping & Delivery</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-settings-locations.html" class="menu-link">
<div data-i18n="Locations">Locations</div>
</a>
</li>
<li class="menu-item">
<a href="app-ecommerce-settings-notifications.html" class="menu-link">
<div data-i18n="Notifications">Notifications</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-book-open"></i>
<div data-i18n="Academy">Academy</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-academy-dashboard.html" class="menu-link">
<div data-i18n="Dashboard">Dashboard</div>
</a>
</li>
<li class="menu-item">
<a href="app-academy-course.html" class="menu-link">
<div data-i18n="My Course">My Course</div>
</a>
</li>
<li class="menu-item">
<a href="app-academy-course-details.html" class="menu-link">
<div data-i18n="Course Details">Course Details</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-car"></i>
<div data-i18n="Logistics">Logistics</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-logistics-dashboard.html" class="menu-link">
<div data-i18n="Dashboard">Dashboard</div>
</a>
</li>
<li class="menu-item">
<a href="app-logistics-fleet.html" class="menu-link">
<div data-i18n="Fleet">Fleet</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-food-menu"></i>
<div data-i18n="Invoice">Invoice</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-invoice-list.html" class="menu-link">
<div data-i18n="List">List</div>
</a>
</li>
<li class="menu-item">
<a href="app-invoice-preview.html" class="menu-link">
<div data-i18n="Preview">Preview</div>
</a>
</li>
<li class="menu-item">
<a href="app-invoice-edit.html" class="menu-link">
<div data-i18n="Edit">Edit</div>
</a>
</li>
<li class="menu-item">
<a href="app-invoice-add.html" class="menu-link">
<div data-i18n="Add">Add</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-user"></i>
<div data-i18n="Users">Users</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-user-list.html" class="menu-link">
<div data-i18n="List">List</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="View">View</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-user-view-account.html" class="menu-link">
<div data-i18n="Account">Account</div>
</a>
</li>
<li class="menu-item">
<a href="app-user-view-security.html" class="menu-link">
<div data-i18n="Security">Security</div>
</a>
</li>
<li class="menu-item">
<a href="app-user-view-billing.html" class="menu-link">
<div data-i18n="Billing & Plans">Billing & Plans</div>
</a>
</li>
<li class="menu-item">
<a href="app-user-view-notifications.html" class="menu-link">
<div data-i18n="Notifications">Notifications</div>
</a>
</li>
<li class="menu-item">
<a href="app-user-view-connections.html" class="menu-link">
<div data-i18n="Connections">Connections</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-check-shield"></i>
<div data-i18n="Roles & Permissions">Roles & Permission</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="app-access-roles.html" class="menu-link">
<div data-i18n="Roles">Roles</div>
</a>
</li>
<li class="menu-item">
<a href="app-access-permission.html" class="menu-link">
<div data-i18n="Permission">Permission</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<!-- Pages -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-collection"></i>
<div data-i18n="Pages">Pages</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-store"></i>
<div data-i18n="Front Pages">Front Pages</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="../front-pages/landing-page.html" class="menu-link" target="_blank">
<div data-i18n="Landing">Landing</div>
</a>
</li>
<li class="menu-item">
<a href="../front-pages/pricing-page.html" class="menu-link" target="_blank">
<div data-i18n="Pricing">Pricing</div>
</a>
</li>
<li class="menu-item">
<a href="../front-pages/payment-page.html" class="menu-link" target="_blank">
<div data-i18n="Payment">Payment</div>
</a>
</li>
<li class="menu-item">
<a href="../front-pages/checkout-page.html" class="menu-link" target="_blank">
<div data-i18n="Checkout">Checkout</div>
</a>
</li>
<li class="menu-item">
<a href="../front-pages/help-center-landing.html" class="menu-link" target="_blank">
<div data-i18n="Help Center">Help Center</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-user-circle"></i>
<div data-i18n="User Profile">User Profile</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="pages-profile-user.html" class="menu-link">
<div data-i18n="Profile">Profile</div>
</a>
</li>
<li class="menu-item">
<a href="pages-profile-teams.html" class="menu-link">
<div data-i18n="Teams">Teams</div>
</a>
</li>
<li class="menu-item">
<a href="pages-profile-projects.html" class="menu-link">
<div data-i18n="Projects">Projects</div>
</a>
</li>
<li class="menu-item">
<a href="pages-profile-connections.html" class="menu-link">
<div data-i18n="Connections">Connections</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-cog"></i>
<div data-i18n="Account Settings">Account Settings</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="pages-account-settings-account.html" class="menu-link">
<div data-i18n="Account">Account</div>
</a>
</li>
<li class="menu-item">
<a href="pages-account-settings-security.html" class="menu-link">
<div data-i18n="Security">Security</div>
</a>
</li>
<li class="menu-item">
<a href="pages-account-settings-billing.html" class="menu-link">
<div data-i18n="Billing & Plans">Billing & Plans</div>
</a>
</li>
<li class="menu-item">
<a href="pages-account-settings-notifications.html" class="menu-link">
<div data-i18n="Notifications">Notifications</div>
</a>
</li>
<li class="menu-item">
<a href="pages-account-settings-connections.html" class="menu-link">
<div data-i18n="Connections">Connections</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="pages-faq.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-help-circle"></i>
<div data-i18n="FAQ">FAQ</div>
</a>
</li>
<li class="menu-item">
<a href="pages-pricing.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-diamond"></i>
<div data-i18n="Pricing">Pricing</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-shape-circle"></i>
<div data-i18n="Misc">Misc</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="pages-misc-error.html" class="menu-link" target="_blank">
<div data-i18n="Error">Error</div>
</a>
</li>
<li class="menu-item">
<a href="pages-misc-under-maintenance.html" class="menu-link" target="_blank">
<div data-i18n="Under Maintenance">Under Maintenance</div>
</a>
</li>
<li class="menu-item">
<a href="pages-misc-comingsoon.html" class="menu-link" target="_blank">
<div data-i18n="Coming Soon">Coming Soon</div>
</a>
</li>
<li class="menu-item">
<a href="pages-misc-not-authorized.html" class="menu-link" target="_blank">
<div data-i18n="Not Authorized">Not Authorized</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-lock-open-alt"></i>
<div data-i18n="Authentications">Authentications</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Login">Login</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-login-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-login-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Register">Register</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-register-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-register-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
<li class="menu-item">
<a href="auth-register-multisteps.html" class="menu-link" target="_blank">
<div data-i18n="Multi-steps">Multi-steps</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Verify Email">Verify Email</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-verify-email-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-verify-email-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Reset Password">Reset Password</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-reset-password-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-reset-password-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Forgot Password">Forgot Password</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-forgot-password-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-forgot-password-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Two Steps">Two Steps</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="auth-two-steps-basic.html" class="menu-link" target="_blank">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="auth-two-steps-cover.html" class="menu-link" target="_blank">
<div data-i18n="Cover">Cover</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-spreadsheet"></i>
<div data-i18n="Wizard Examples">Wizard Examples</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="wizard-ex-checkout.html" class="menu-link">
<div data-i18n="Checkout">Checkout</div>
</a>
</li>
<li class="menu-item">
<a href="wizard-ex-property-listing.html" class="menu-link">
<div data-i18n="Property Listing">Property Listing</div>
</a>
</li>
<li class="menu-item">
<a href="wizard-ex-create-deal.html" class="menu-link">
<div data-i18n="Create Deal">Create Deal</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="modal-examples.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-window-open"></i>
<div data-i18n="Modal Examples">Modal Examples</div>
</a>
</li>
</ul>
</li>
<!-- Components -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-code-block"></i>
<div data-i18n="Components">Components</div>
</a>
<ul class="menu-sub">
<!-- Cards -->
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-collection"></i>
<div data-i18n="Cards">Cards</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="cards-basic.html" class="menu-link">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="cards-advance.html" class="menu-link">
<div data-i18n="Advance">Advance</div>
</a>
</li>
<li class="menu-item">
<a href="cards-statistics.html" class="menu-link">
<div data-i18n="Statistics">Statistics</div>
</a>
</li>
<li class="menu-item">
<a href="cards-analytics.html" class="menu-link">
<div data-i18n="Analytics">Analytics</div>
</a>
</li>
<li class="menu-item">
<a href="cards-gamifications.html" class="menu-link">
<div data-i18n="Gamifications">Gamifications</div>
</a>
</li>
<li class="menu-item">
<a href="cards-actions.html" class="menu-link">
<div data-i18n="Actions">Actions</div>
</a>
</li>
</ul>
</li>
<!-- User interface -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-box"></i>
<div data-i18n="User interface">User interface</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="ui-accordion.html" class="menu-link">
<div data-i18n="Accordion">Accordion</div>
</a>
</li>
<li class="menu-item">
<a href="ui-alerts.html" class="menu-link">
<div data-i18n="Alerts">Alerts</div>
</a>
</li>
<li class="menu-item">
<a href="ui-badges.html" class="menu-link">
<div data-i18n="Badges">Badges</div>
</a>
</li>
<li class="menu-item">
<a href="ui-buttons.html" class="menu-link">
<div data-i18n="Buttons">Buttons</div>
</a>
</li>
<li class="menu-item">
<a href="ui-carousel.html" class="menu-link">
<div data-i18n="Carousel">Carousel</div>
</a>
</li>
<li class="menu-item">
<a href="ui-collapse.html" class="menu-link">
<div data-i18n="Collapse">Collapse</div>
</a>
</li>
<li class="menu-item">
<a href="ui-dropdowns.html" class="menu-link">
<div data-i18n="Dropdowns">Dropdowns</div>
</a>
</li>
<li class="menu-item">
<a href="ui-footer.html" class="menu-link">
<div data-i18n="Footer">Footer</div>
</a>
</li>
<li class="menu-item">
<a href="ui-list-groups.html" class="menu-link">
<div data-i18n="List groups">List groups</div>
</a>
</li>
<li class="menu-item">
<a href="ui-modals.html" class="menu-link">
<div data-i18n="Modals">Modals</div>
</a>
</li>
<li class="menu-item">
<a href="ui-navbar.html" class="menu-link">
<div data-i18n="Navbar">Navbar</div>
</a>
</li>
<li class="menu-item">
<a href="ui-offcanvas.html" class="menu-link">
<div data-i18n="Offcanvas">Offcanvas</div>
</a>
</li>
<li class="menu-item">
<a href="ui-pagination-breadcrumbs.html" class="menu-link">
<div data-i18n="Pagination & Breadcrumbs">Pagination &amp; Breadcrumbs</div>
</a>
</li>
<li class="menu-item">
<a href="ui-progress.html" class="menu-link">
<div data-i18n="Progress">Progress</div>
</a>
</li>
<li class="menu-item">
<a href="ui-spinners.html" class="menu-link">
<div data-i18n="Spinners">Spinners</div>
</a>
</li>
<li class="menu-item">
<a href="ui-tabs-pills.html" class="menu-link">
<div data-i18n="Tabs & Pills">Tabs &amp; Pills</div>
</a>
</li>
<li class="menu-item">
<a href="ui-toasts.html" class="menu-link">
<div data-i18n="Toasts">Toasts</div>
</a>
</li>
<li class="menu-item">
<a href="ui-tooltips-popovers.html" class="menu-link">
<div data-i18n="Tooltips & Popovers">Tooltips &amp; Popovers</div>
</a>
</li>
<li class="menu-item">
<a href="ui-typography.html" class="menu-link">
<div data-i18n="Typography">Typography</div>
</a>
</li>
</ul>
</li>
<!-- Extended components -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-copy"></i>
<div data-i18n="Extended UI">Extended UI</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="extended-ui-avatar.html" class="menu-link">
<div data-i18n="Avatar">Avatar</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-blockui.html" class="menu-link">
<div data-i18n="BlockUI">BlockUI</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-drag-and-drop.html" class="menu-link">
<div data-i18n="Drag & Drop">Drag &amp; Drop</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-media-player.html" class="menu-link">
<div data-i18n="Media Player">Media Player</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-perfect-scrollbar.html" class="menu-link">
<div data-i18n="Perfect Scrollbar">Perfect Scrollbar</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-star-ratings.html" class="menu-link">
<div data-i18n="Star Ratings">Star Ratings</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-sweetalert2.html" class="menu-link">
<div data-i18n="SweetAlert2">SweetAlert2</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-text-divider.html" class="menu-link">
<div data-i18n="Text Divider">Text Divider</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<div data-i18n="Timeline">Timeline</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="extended-ui-timeline-basic.html" class="menu-link">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-timeline-fullscreen.html" class="menu-link">
<div data-i18n="Fullscreen">Fullscreen</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="extended-ui-tour.html" class="menu-link">
<div data-i18n="Tour">Tour</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-treeview.html" class="menu-link">
<div data-i18n="Treeview">Treeview</div>
</a>
</li>
<li class="menu-item">
<a href="extended-ui-misc.html" class="menu-link">
<div data-i18n="Miscellaneous">Miscellaneous</div>
</a>
</li>
</ul>
</li>
<!-- Icons -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-crown"></i>
<div data-i18n="Icons">Icons</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="icons-boxicons.html" class="menu-link">
<div data-i18n="Boxicons">Boxicons</div>
</a>
</li>
<li class="menu-item">
<a href="icons-font-awesome.html" class="menu-link">
<div data-i18n="Fontawesome">Fontawesome</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<!-- Forms -->
<li class="menu-item active">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-book-content"></i>
<div data-i18n="Forms">Forms</div>
</a>
<ul class="menu-sub">
<li class="menu-item active">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-detail"></i>
<div data-i18n="Form Elements">Form Elements</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="forms-basic-inputs.html" class="menu-link">
<div data-i18n="Basic Inputs">Basic Inputs</div>
</a>
</li>
<li class="menu-item">
<a href="forms-input-groups.html" class="menu-link">
<div data-i18n="Input groups">Input groups</div>
</a>
</li>
<li class="menu-item active">
<a href="forms-custom-options.html" class="menu-link">
<div data-i18n="Custom Options">Custom Options</div>
</a>
</li>
<li class="menu-item">
<a href="forms-editors.html" class="menu-link">
<div data-i18n="Editors">Editors</div>
</a>
</li>
<li class="menu-item">
<a href="forms-file-upload.html" class="menu-link">
<div data-i18n="File Upload">File Upload</div>
</a>
</li>
<li class="menu-item">
<a href="forms-pickers.html" class="menu-link">
<div data-i18n="Pickers">Pickers</div>
</a>
</li>
<li class="menu-item">
<a href="forms-selects.html" class="menu-link">
<div data-i18n="Select & Tags">Select &amp; Tags</div>
</a>
</li>
<li class="menu-item">
<a href="forms-sliders.html" class="menu-link">
<div data-i18n="Sliders">Sliders</div>
</a>
</li>
<li class="menu-item">
<a href="forms-switches.html" class="menu-link">
<div data-i18n="Switches">Switches</div>
</a>
</li>
<li class="menu-item">
<a href="forms-extras.html" class="menu-link">
<div data-i18n="Extras">Extras</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-detail"></i>
<div data-i18n="Form Layouts">Form Layouts</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="form-layouts-vertical.html" class="menu-link">
<div data-i18n="Vertical Form">Vertical Form</div>
</a>
</li>
<li class="menu-item">
<a href="form-layouts-horizontal.html" class="menu-link">
<div data-i18n="Horizontal Form">Horizontal Form</div>
</a>
</li>
<li class="menu-item">
<a href="form-layouts-sticky.html" class="menu-link">
<div data-i18n="Sticky Actions">Sticky Actions</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-carousel"></i>
<div data-i18n="Form Wizard">Form Wizard</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="form-wizard-numbered.html" class="menu-link">
<div data-i18n="Numbered">Numbered</div>
</a>
</li>
<li class="menu-item">
<a href="form-wizard-icons.html" class="menu-link">
<div data-i18n="Icons">Icons</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="form-validation.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-list-check"></i>
<div data-i18n="Form Validation">Form Validation</div>
</a>
</li>
</ul>
</li>
<!-- Tables -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-grid-alt"></i>
<div data-i18n="Tables">Tables</div>
</a>
<ul class="menu-sub">
<!-- Tables -->
<li class="menu-item">
<a href="tables-basic.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-table"></i>
<div data-i18n="Tables">Tables</div>
</a>
</li>
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-grid"></i>
<div data-i18n="Datatables">Datatables</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="tables-datatables-basic.html" class="menu-link">
<div data-i18n="Basic">Basic</div>
</a>
</li>
<li class="menu-item">
<a href="tables-datatables-advanced.html" class="menu-link">
<div data-i18n="Advanced">Advanced</div>
</a>
</li>
<li class="menu-item">
<a href="tables-datatables-extensions.html" class="menu-link">
<div data-i18n="Extensions">Extensions</div>
</a>
</li>
</ul>
</li>
</ul>
</li>
<!-- Charts & Maps -->
<li class="menu-item">
<a href="javascript:void(0)" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-bar-chart-square"></i>
<div data-i18n="Charts & Maps">Charts & Maps</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="javascript:void(0);" class="menu-link menu-toggle">
<i class="menu-icon tf-icons bx bx-chart"></i>
<div data-i18n="Charts">Charts</div>
</a>
<ul class="menu-sub">
<li class="menu-item">
<a href="charts-apex.html" class="menu-link">
<div data-i18n="Apex Charts">Apex Charts</div>
</a>
</li>
<li class="menu-item">
<a href="charts-chartjs.html" class="menu-link">
<div data-i18n="ChartJS">ChartJS</div>
</a>
</li>
</ul>
</li>
<li class="menu-item">
<a href="maps-leaflet.html" class="menu-link">
<i class="menu-icon tf-icons bx bx-map-alt"></i>
<div data-i18n="Leaflet Maps">Leaflet Maps</div>
</a>
</li>
</ul>
</li>
</ul>
</div>
</aside>
<!-- / Menu -->
<!-- Content -->
<div class="container-xxl flex-grow-1 container-p-y">
<div class="row gy-6">
<!-- Basic Custom Radios -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Basic Radio</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-basic">
<label class="form-check-label custom-option-content" for="customRadioTemp1">
<input
name="customRadioTemp"
class="form-check-input"
type="radio"
value=""
id="customRadioTemp1"
checked />
<span class="custom-option-header">
<span class="h6 mb-0">Basic</span>
<small class="text-muted">Free</small>
</span>
<span class="custom-option-body">
<small>Get 1 project with 1 teams members.</small>
</span>
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-basic">
<label class="form-check-label custom-option-content" for="customRadioTemp2">
<input
name="customRadioTemp"
class="form-check-input"
type="radio"
value=""
id="customRadioTemp2" />
<span class="custom-option-header">
<span class="h6 mb-0">Premium</span>
<small class="text-muted">$ 5.00</small>
</span>
<span class="custom-option-body">
<small>Get 5 projects with 5 team members.</small>
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Basic Custom Radios -->
<!-- Basic Custom Checkboxes -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Basic Checkboxes</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-basic">
<label class="form-check-label custom-option-content" for="customCheckTemp3">
<input class="form-check-input" type="checkbox" value="" id="customCheckTemp3" checked />
<span class="custom-option-header">
<span class="h6 mb-0">Discount</span>
<small class="text-muted">20%</small>
</span>
<span class="custom-option-body">
<small class="option-text">Get 20% off on your next purchases!</small>
</span>
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-basic">
<label class="form-check-label custom-option-content" for="customCheckTemp4">
<input class="form-check-input" type="checkbox" value="" id="customCheckTemp4" />
<span class="custom-option-header">
<span class="h6 mb-0">Updates</span>
<small class="text-muted">Free</small>
</span>
<span class="custom-option-body">
<small>Get Updates regarding related products.</small>
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Basic Custom Checkboxes -->
<!-- Custom Icon Radios -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Option Radios With Icons</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioIcon1">
<span class="custom-option-body">
<i class="bx bx-rocket"></i>
<span class="custom-option-title">Starter</span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input
name="customOptionRadioIcon"
class="form-check-input"
type="radio"
value=""
id="customRadioIcon1"
checked />
</label>
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioIcon2">
<span class="custom-option-body">
<i class="bx bx-user"></i>
<span class="custom-option-title"> Personal </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input
name="customOptionRadioIcon"
class="form-check-input"
type="radio"
value=""
id="customRadioIcon2" />
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioIcon3">
<span class="custom-option-body">
<i class="bx bx-crown"></i>
<span class="custom-option-title"> Enterprise </span>
<small>Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input
name="customOptionRadioIcon"
class="form-check-input"
type="radio"
value=""
id="customRadioIcon3" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom Icon Radios -->
<!-- Custom Icon Checkbox -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Option Checkboxes With Icons</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxIcon1">
<span class="custom-option-body">
<i class="bx bx-server"></i>
<span class="custom-option-title"> Backup </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input
class="form-check-input"
type="checkbox"
value=""
id="customCheckboxIcon1"
checked />
</label>
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxIcon2">
<span class="custom-option-body">
<i class="bx bx-shield"></i>
<span class="custom-option-title"> Encrypt </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input class="form-check-input" type="checkbox" value="" id="customCheckboxIcon2" />
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxIcon3">
<span class="custom-option-body">
<i class="bx bx-lock"></i>
<span class="custom-option-title"> Site Lock </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input class="form-check-input" type="checkbox" value="" id="customCheckboxIcon3" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom Icon Checkbox -->
<!-- Custom Svg Icon Radios -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Option Radios With SVG Icons</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioSvg1">
<span class="custom-option-body">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M22.9744 6.12736C22.6916 6.4134 22.4218 6.90878 22.1938 7.59469C21.9711 8.26486 21.8162 9.03022 21.7107 9.77016C21.6213 10.3965 21.5697 10.9873 21.5399 11.4601C22.0127 11.4304 22.6035 11.3787 23.2298 11.2893C23.9698 11.1838 24.7351 11.0289 25.4053 10.8062C26.0912 10.5782 26.5866 10.3084 26.8726 10.0256C27.3886 9.50886 27.6784 8.80843 27.6784 8.07813C27.6784 7.34706 27.388 6.64593 26.871 6.12899C26.3541 5.61204 25.6529 5.32162 24.9219 5.32162C24.1916 5.32162 23.4911 5.61143 22.9744 6.12736ZM27.5781 10.7344L28.2852 11.4415C29.1772 10.5495 29.6784 9.33963 29.6784 8.07813C29.6784 6.81663 29.1772 5.60679 28.2852 4.71477C27.3932 3.82276 26.1834 3.32162 24.9219 3.32162C23.6604 3.32162 22.4505 3.82276 21.5585 4.71477L21.5554 4.71789C21.0928 5.18463 20.7539 5.78792 20.5 6.40993C20.2461 5.78792 19.9071 5.18463 19.4445 4.71789L19.4445 4.71789L19.4414 4.71477C18.5494 3.82276 17.3395 3.32162 16.078 3.32162C14.8165 3.32162 13.6067 3.82276 12.7147 4.71477C11.8227 5.60679 11.3215 6.81663 11.3215 8.07813C11.3215 9.33963 11.8227 10.5495 12.7147 11.4415L13.4218 10.7344L12.7178 11.4446C12.7366 11.4633 12.7557 11.4817 12.775 11.5H6.75C5.50736 11.5 4.5 12.5074 4.5 13.75V18.75C4.5 19.9926 5.50736 21 6.75 21H7V31.25C7 31.8467 7.23705 32.419 7.65901 32.841C8.08097 33.2629 8.65326 33.5 9.25 33.5H20.5H31.75C32.3467 33.5 32.919 33.263 33.341 32.841C33.763 32.419 34 31.8467 34 31.25V21H34.25C35.4926 21 36.5 19.9926 36.5 18.75V13.75C36.5 12.5074 35.4926 11.5 34.25 11.5H28.2249C28.2442 11.4817 28.2633 11.4633 28.2821 11.4446L27.5781 10.7344ZM6.75 13.5C6.61193 13.5 6.5 13.6119 6.5 13.75V18.75C6.5 18.8881 6.61193 19 6.75 19H8H19.5V13.5H6.75ZM21.5 13.5V19H33H34.25C34.3881 19 34.5 18.8881 34.5 18.75V13.75C34.5 13.6119 34.3881 13.5 34.25 13.5H21.5ZM19.5 21H9V31.25C9 31.3163 9.02634 31.3799 9.07322 31.4268C9.12011 31.4737 9.18369 31.5 9.25 31.5H19.5V21ZM21.5 31.5V21H32V31.25C32 31.3163 31.9737 31.3799 31.9268 31.4268C31.8799 31.4737 31.8163 31.5 31.75 31.5H21.5ZM15.5946 10.8062C14.9087 10.5782 14.4133 10.3084 14.1273 10.0256C13.6113 9.50886 13.3215 8.80843 13.3215 8.07813C13.3215 7.34706 13.6119 6.64593 14.1289 6.12899C14.6458 5.61204 15.347 5.32162 16.078 5.32162C16.8083 5.32162 17.5088 5.61143 18.0256 6.12736C18.3083 6.4134 18.5781 6.90878 18.8061 7.59469C19.0288 8.26486 19.1837 9.03022 19.2892 9.77016C19.3786 10.3965 19.4303 10.9873 19.46 11.4601C18.9872 11.4304 18.3964 11.3787 17.7701 11.2893C17.0301 11.1838 16.2648 11.0289 15.5946 10.8062Z"
fill="currentColor" />
<path
d="M33 20V31.25C33 31.5815 32.8683 31.8995 32.6339 32.1339C32.3995 32.3683 32.0815 32.5 31.75 32.5H9.25C8.91848 32.5 8.60054 32.3683 8.36612 32.1339C8.1317 31.8995 8 31.5815 8 31.25V20H33Z"
fill="currentColor"
opacity="0.2" />
</svg>
<span class="custom-option-title"> Design </span>
<small>Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input
name="customRadioSvg"
class="form-check-input"
type="radio"
value=""
id="customRadioSvg1"
checked />
</label>
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioSvg2">
<span class="custom-option-body">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M14 33.75V11.25H6.5C6.16848 11.25 5.85054 11.3817 5.61612 11.6161C5.3817 11.8505 5.25 12.1685 5.25 12.5V32.5C5.25 32.8315 5.3817 33.1495 5.61612 33.3839C5.85054 33.6183 6.16848 33.75 6.5 33.75H14ZM26.5 33.75V11.25H34C34.3315 11.25 34.6495 11.3817 34.8839 11.6161C35.1183 11.8505 35.25 12.1685 35.25 12.5V32.5C35.25 32.8315 35.1183 33.1495 34.8839 33.3839C34.6495 33.6183 34.3315 33.75 34 33.75H26.5Z"
fill="currentColor"
fill-opacity="0.2" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M16.5 5.25C15.5717 5.25 14.6815 5.61875 14.0251 6.27513C13.3687 6.9315 13 7.82174 13 8.75V10.25H6.5C5.25736 10.25 4.25 11.2574 4.25 12.5V32.5C4.25 33.7426 5.25736 34.75 6.5 34.75H14H26.5H34C35.2426 34.75 36.25 33.7426 36.25 32.5V12.5C36.25 11.2574 35.2426 10.25 34 10.25H27.5V8.75C27.5 7.82174 27.1313 6.9315 26.4749 6.27513C25.8185 5.61875 24.9283 5.25 24 5.25H16.5ZM25.5 10.25V8.75C25.5 8.35218 25.342 7.97064 25.0607 7.68934C24.7794 7.40804 24.3978 7.25 24 7.25H16.5C16.1022 7.25 15.7206 7.40804 15.4393 7.68934C15.158 7.97064 15 8.35218 15 8.75V10.25H25.5ZM15 12.25H25.5V32.75H15V12.25ZM13 12.25H6.5C6.36193 12.25 6.25 12.3619 6.25 12.5V32.5C6.25 32.6381 6.36193 32.75 6.5 32.75H13V12.25ZM27.5 32.75V12.25H34C34.1381 12.25 34.25 12.3619 34.25 12.5V32.5C34.25 32.6381 34.1381 32.75 34 32.75H27.5Z"
fill="currentColor" />
</svg>
<span class="custom-option-title"> Development </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input
name="customRadioSvg"
class="form-check-input"
type="radio"
value=""
id="customRadioSvg2" />
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customRadioSvg3">
<span class="custom-option-body">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M15.25 17.5V15H5.25V17.5C5.25 18.8261 5.77678 20.0979 6.71447 21.0355C7.65215 21.9732 8.92392 22.5 10.25 22.5C11.5761 22.5 12.8479 21.9732 13.7855 21.0355C14.7232 20.0979 15.25 18.8261 15.25 17.5ZM35.25 17.5V15H25.25V17.5C25.25 18.8261 25.7768 20.0979 26.7145 21.0355C27.6521 21.9732 28.9239 22.5 30.25 22.5C31.5761 22.5 32.8479 21.9732 33.7855 21.0355C34.7232 20.0979 35.25 18.8261 35.25 17.5Z"
fill="currentColor"
fill-opacity="0.2" />
<path
d="M8.6875 6.25H31.8125C32.0837 6.25223 32.347 6.3415 32.5636 6.50466C32.7802 6.66782 32.9386 6.89623 33.0156 7.15625L35.25 15H5.25L7.48437 7.15625C7.56137 6.89623 7.71984 6.66782 7.93644 6.50466C8.15305 6.3415 8.41633 6.25223 8.6875 6.25V6.25Z"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M6.25 15C6.25 14.4477 5.80228 14 5.25 14C4.69772 14 4.25 14.4477 4.25 15V17.5C4.25 19.0913 4.88214 20.6174 6.00736 21.7426C6.2389 21.9742 6.48743 22.1849 6.75 22.3734V32.5C6.75 33.0967 6.98705 33.669 7.40901 34.091C7.83097 34.5129 8.40326 34.75 9 34.75H31.5C32.0967 34.75 32.669 34.5129 33.091 34.091C33.513 33.669 33.75 33.0967 33.75 32.5V22.3734C34.0126 22.1849 34.2611 21.9742 34.4926 21.7426C35.6179 20.6174 36.25 19.0913 36.25 17.5V15C36.25 14.4477 35.8023 14 35.25 14C34.6977 14 34.25 14.4477 34.25 15V17.5C34.25 18.5609 33.8286 19.5783 33.0784 20.3284C32.8685 20.5384 32.6376 20.7226 32.3906 20.879C32.2918 20.9171 32.2004 20.9705 32.1196 21.0362C31.5486 21.338 30.9077 21.5 30.25 21.5C29.1891 21.5 28.1717 21.0786 27.4216 20.3284C26.6714 19.5783 26.25 18.5609 26.25 17.5V15C26.25 14.4477 25.8023 14 25.25 14C24.6977 14 24.25 14.4477 24.25 15V17.5C24.25 18.5609 23.8286 19.5783 23.0784 20.3284C22.3283 21.0786 21.3109 21.5 20.25 21.5C19.1891 21.5 18.1717 21.0786 17.4216 20.3284C16.6714 19.5783 16.25 18.5609 16.25 17.5V15C16.25 14.4477 15.8023 14 15.25 14C14.6977 14 14.25 14.4477 14.25 15V17.5C14.25 18.5609 13.8286 19.5783 13.0784 20.3284C12.3283 21.0786 11.3109 21.5 10.25 21.5C9.59233 21.5 8.95135 21.338 8.38041 21.0362C8.29955 20.9705 8.20823 20.9171 8.10933 20.879C7.86241 20.7226 7.63153 20.5384 7.42157 20.3284C6.67143 19.5783 6.25 18.5609 6.25 17.5V15ZM25.25 20.8167C25.0306 21.1474 24.7774 21.4578 24.4926 21.7426C23.3674 22.8679 21.8413 23.5 20.25 23.5C18.6587 23.5 17.1326 22.8679 16.0074 21.7426C15.7226 21.4578 15.4694 21.1474 15.25 20.8167C15.0306 21.1474 14.7774 21.4578 14.4926 21.7426C13.3674 22.8679 11.8413 23.5 10.25 23.5C9.7396 23.5 9.23591 23.435 8.75 23.3095V32.5C8.75 32.5663 8.77634 32.6299 8.82322 32.6768C8.87011 32.7237 8.93369 32.75 9 32.75H31.5C31.5663 32.75 31.6299 32.7237 31.6768 32.6768C31.7237 32.6299 31.75 32.5663 31.75 32.5V23.3095C31.2641 23.435 30.7604 23.5 30.25 23.5C28.6587 23.5 27.1326 22.8679 26.0074 21.7426C25.7226 21.4578 25.4694 21.1474 25.25 20.8167Z"
fill="currentColor" />
</svg>
<span class="custom-option-title"> Native App </span>
<small>Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input
name="customRadioSvg"
class="form-check-input"
type="radio"
value=""
id="customRadioSvg3" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom Svg Icon Radios -->
<!-- Custom SVG Icon Checkbox -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Option Checkboxes With SVG Icons</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxSvg1">
<span class="custom-option-body">
<svg
width="59"
height="58"
viewBox="0 0 59 58"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M48.9019 33.6218L41.7878 25.0804C42.0597 30.314 40.7683 36.4086 36.7808 43.364L43.5777 48.8015C43.8194 48.9935 44.1061 49.1205 44.4106 49.1706C44.7151 49.2207 45.0274 49.1922 45.3178 49.0879C45.6083 48.9835 45.8673 48.8067 46.0702 48.5742C46.2732 48.3417 46.4134 48.0612 46.4777 47.7593L49.2644 35.1625C49.3316 34.8954 49.3337 34.6161 49.2706 34.348C49.2076 34.08 49.0811 33.8309 48.9019 33.6218ZM10.2956 33.7578L17.4097 25.239C17.1378 30.4726 18.4292 36.5672 22.4167 43.5L15.6198 48.9375C15.3797 49.1294 15.0947 49.257 14.7916 49.3084C14.4885 49.3598 14.1773 49.3333 13.8873 49.2314C13.5973 49.1294 13.338 48.9554 13.1338 48.7256C12.9295 48.4958 12.7871 48.2179 12.7198 47.9179L9.93313 35.2984C9.86594 35.0313 9.8638 34.7521 9.92688 34.484C9.98995 34.2159 10.1164 33.9669 10.2956 33.7578Z"
fill="currentColor"
opacity="0.2" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M27.9017 3.71102C28.3979 3.30011 29.0221 3.07513 29.6666 3.07513C30.3127 3.07513 30.9383 3.30117 31.435 3.71394C33.6315 5.50224 38.386 9.93871 41.0105 16.7606C41.9219 19.1296 42.5713 21.7739 42.7735 24.6785L49.8022 33.113C50.0828 33.4423 50.2809 33.8338 50.38 34.255C50.4785 34.6735 50.4764 35.1093 50.374 35.5267L47.5901 48.1336L47.5894 48.1367C47.485 48.6022 47.264 49.0335 46.9471 49.39C46.6302 49.7465 46.2278 50.0166 45.7778 50.1748C45.3278 50.333 44.8449 50.3742 44.3746 50.2944C43.9043 50.2146 43.4621 50.0165 43.0894 49.7188L43.0889 49.7184L36.566 44.5H22.7675L16.2445 49.7184L16.2441 49.7188C15.8714 50.0165 15.4291 50.2146 14.9588 50.2944C14.4885 50.3742 14.0057 50.333 13.5556 50.1748C13.1056 50.0166 12.7032 49.7465 12.3863 49.39C12.0694 49.0335 11.8484 48.6022 11.7441 48.1367L11.7434 48.1336L8.95943 35.5267C8.85707 35.1093 8.85499 34.6735 8.95346 34.255C9.05262 33.8335 9.25088 33.4419 9.53173 33.1125L16.4274 24.8553C16.6112 21.877 17.2734 19.1695 18.2135 16.7491C20.8639 9.92541 25.6801 5.4896 27.9017 3.71102ZM40.8041 25.2385C40.7893 25.1573 40.7846 25.0748 40.7899 24.993C40.6159 22.2127 40.0004 19.7051 39.1438 17.4787C36.6951 11.1136 32.2331 6.94203 30.1682 5.26158L30.1583 5.25355L30.1584 5.25349C30.0204 5.13826 29.8464 5.07513 29.6666 5.07513C29.4868 5.07513 29.3128 5.13826 29.1748 5.25349L29.1585 5.26684C27.0721 6.93594 22.5504 11.1072 20.0778 17.4732C19.1887 19.7623 18.5587 22.3492 18.4096 25.2244C18.4102 25.2674 18.4081 25.3106 18.4032 25.3535C18.1745 30.253 19.3435 35.9842 22.9982 42.5H36.3292C39.938 35.9325 41.0647 30.1631 40.8041 25.2385ZM48.2696 34.398L42.8122 27.8492C42.6094 32.4348 41.2748 37.5835 38.2005 43.2464L44.3378 48.1563C44.4455 48.2423 44.5733 48.2995 44.7091 48.3226C44.845 48.3456 44.9845 48.3337 45.1145 48.288C45.2445 48.2423 45.3607 48.1643 45.4523 48.0613C45.5436 47.9586 45.6073 47.8344 45.6376 47.7004L45.6378 47.6992L48.4239 35.0828L48.4272 35.0682L48.4305 35.0545C48.4587 34.9425 48.4596 34.8255 48.4332 34.7131C48.4067 34.6007 48.3537 34.4963 48.2786 34.4086L48.2695 34.3981L48.2696 34.398ZM16.4139 27.9916L11.0632 34.3988L11.0549 34.4087L11.0549 34.4086C10.9798 34.4963 10.9267 34.6007 10.9003 34.7131C10.8738 34.8254 10.8747 34.9425 10.9029 35.0545C10.9053 35.0639 10.9075 35.0734 10.9096 35.0828L13.6956 47.6992L13.6959 47.7005C13.7262 47.8345 13.7899 47.9586 13.8812 48.0613C13.9727 48.1643 14.089 48.2423 14.219 48.288C14.349 48.3337 14.4885 48.3456 14.6243 48.3226C14.7602 48.2995 14.888 48.2423 14.9956 48.1563L21.1271 43.2511C18.0233 37.6471 16.6517 32.5443 16.4139 27.9916ZM25.0417 50.75C25.0417 50.1977 25.4895 49.75 26.0417 49.75H33.2917C33.844 49.75 34.2917 50.1977 34.2917 50.75C34.2917 51.3023 33.844 51.75 33.2917 51.75H26.0417C25.4895 51.75 25.0417 51.3023 25.0417 50.75ZM32.3855 21.75C32.3855 23.2515 31.1683 24.4688 29.6667 24.4688C28.1652 24.4688 26.948 23.2515 26.948 21.75C26.948 20.2485 28.1652 19.0313 29.6667 19.0313C31.1683 19.0313 32.3855 20.2485 32.3855 21.75Z"
fill="currentColor" />
</svg>
<span class="custom-option-title"> Design </span>
<small>Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input
class="form-check-input"
type="checkbox"
value=""
id="customCheckboxSvg1"
checked />
</label>
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxSvg2">
<span class="custom-option-body">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M12.5468 26.0937C11.0586 24.9366 9.85336 23.456 9.02227 21.764C8.19117 20.0721 7.75606 18.2131 7.74989 16.3281C7.71864 9.54685 13.1718 3.90622 19.953 3.74997C22.5775 3.68776 25.1549 4.45342 27.3198 5.93836C29.4847 7.4233 31.1271 9.55214 32.0141 12.023C32.9011 14.4938 32.9877 17.1812 32.2616 19.704C31.5354 22.2267 30.0335 24.4569 27.9686 26.0781C27.5125 26.4307 27.1431 26.8829 26.8885 27.4001C26.6339 27.9174 26.501 28.486 26.4999 29.0625V30C26.4999 30.3315 26.3682 30.6494 26.1338 30.8839C25.8994 31.1183 25.5814 31.25 25.2499 31.25H15.2499C14.9184 31.25 14.6004 31.1183 14.366 30.8839C14.1316 30.6494 13.9999 30.3315 13.9999 30V29.0625C13.996 28.4903 13.8633 27.9264 13.6118 27.4124C13.3602 26.8985 12.9962 26.4478 12.5468 26.0937Z"
fill="currentColor"
fill-opacity="0.2" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M26.7542 6.763C24.7625 5.39686 22.3912 4.69245 19.9767 4.74969L19.976 4.74971C19.7335 4.7553 19.4927 4.76853 19.254 4.78917L19.93 2.75024C22.7642 2.68319 25.5476 3.5101 27.8855 5.11371C30.2235 6.71744 31.9973 9.0166 32.9553 11.6851C33.9133 14.3536 34.0068 17.2559 33.2226 19.9806C32.4383 22.7052 30.8162 25.1137 28.5862 26.8646L28.5802 26.8693L28.5802 26.8693C28.2447 27.1286 27.973 27.4612 27.7857 27.8417C27.5986 28.2219 27.5008 28.6398 27.4999 29.0635L27.4999 29.0644L27.4999 30C27.4999 30.5967 27.2628 31.169 26.8409 31.591C26.4189 32.0129 25.8466 32.25 25.2499 32.25H15.2499C14.6532 32.25 14.0809 32.0129 13.6589 31.591C13.2369 31.169 12.9999 30.5967 12.9999 30V29.0662C12.9965 28.6451 12.8987 28.2302 12.7136 27.8521C12.5285 27.4738 12.2607 27.142 11.9302 26.881L12.6056 24.8439C12.7854 25.0029 12.9705 25.1565 13.1606 25.3043L12.5468 26.0937L13.1656 25.3082C13.7329 25.7552 14.1924 26.3241 14.51 26.9728C14.8275 27.6215 14.9949 28.3334 14.9999 29.0556L14.9999 29.0625L14.9999 30C14.9999 30.0663 15.0262 30.1299 15.0731 30.1768C15.12 30.2236 15.1836 30.25 15.2499 30.25H25.2499C25.3162 30.25 25.3798 30.2236 25.4267 30.1768C25.4735 30.1299 25.4999 30.0663 25.4999 30V29.0625L25.4999 29.0605C25.5013 28.3316 25.6694 27.6126 25.9913 26.9585C26.3125 26.3057 26.7786 25.7348 27.3539 25.2894C29.2521 23.7981 30.6329 21.7472 31.3006 19.4274C31.9686 17.1064 31.889 14.634 31.0729 12.3608C30.2569 10.0877 28.7459 8.12915 26.7542 6.763ZM12.6055 24.8438L12.6056 24.8439L19.254 4.78917L19.2534 4.78923L19.9293 2.75025C12.6002 2.91949 6.71651 9.00969 6.7499 16.3321C6.75667 18.3686 7.22681 20.3769 8.1247 22.2049C9.02219 24.032 10.3235 25.6311 11.9302 26.881L12.6055 24.8438ZM12.6055 24.8438C11.4909 23.8582 10.5778 22.6627 9.91983 21.3231C9.15564 19.7674 8.75556 18.0581 8.74989 16.3248L8.74988 16.3235C8.72225 10.3269 13.3596 5.29929 19.2534 4.78923L12.6055 24.8438ZM13 36.25C13 35.6977 13.4477 35.25 14 35.25H26.5C27.0523 35.25 27.5 35.6977 27.5 36.25C27.5 36.8023 27.0523 37.25 26.5 37.25H14C13.4477 37.25 13 36.8023 13 36.25ZM21.6828 7.88907C21.1382 7.79676 20.622 8.16335 20.5297 8.70787C20.4374 9.25238 20.804 9.76863 21.3485 9.86093C22.6721 10.0853 23.8935 10.715 24.844 11.6631C25.7945 12.6112 26.4274 13.831 26.6551 15.154C26.7488 15.6983 27.266 16.0636 27.8103 15.9699C28.3546 15.8762 28.7198 15.359 28.6261 14.8147C28.3281 13.0836 27.5001 11.4876 26.2564 10.2471C25.0127 9.00656 23.4147 8.18265 21.6828 7.88907Z"
fill="currentColor" />
</svg>
<span class="custom-option-title"> Development </span>
<small>Cake sugar plum fruitcake I love sweet roll jelly-o.</small>
</span>
<input class="form-check-input" type="checkbox" value="" id="customCheckboxSvg2" />
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-icon">
<label class="form-check-label custom-option-content" for="customCheckboxSvg3">
<span class="custom-option-body">
<svg
width="41"
height="40"
viewBox="0 0 41 40"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M29 6.25H20.25L12.5781 16.25L20.25 35L37.75 16.25L29 6.25Z"
fill="currentColor"
fill-opacity="0.2" />
<path
d="M11.5 6.25H29L37.75 16.25L20.25 35L2.75 16.25L11.5 6.25Z"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round" />
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M21.0434 5.64131C20.8542 5.39462 20.5609 5.25 20.25 5.25C19.9391 5.25 19.6458 5.39462 19.4566 5.64131L12.0849 15.25H2.75C2.19772 15.25 1.75 15.6977 1.75 16.25C1.75 16.8023 2.19772 17.25 2.75 17.25H11.9068L19.3245 35.3787C19.4782 35.7545 19.844 36 20.25 36C20.656 36 21.0218 35.7545 21.1755 35.3787L28.5932 17.25H37.75C38.3023 17.25 38.75 16.8023 38.75 16.25C38.75 15.6977 38.3023 15.25 37.75 15.25H28.4151L21.0434 5.64131ZM25.8943 15.25L20.25 7.89287L14.6057 15.25H25.8943ZM14.0678 17.25L20.25 32.3593L26.4322 17.25H14.0678Z"
fill="currentColor" />
</svg>
<span class="custom-option-title"> Native App </span>
<small> Cake sugar plum fruitcake I love sweet roll jelly-o. </small>
</span>
<input class="form-check-input" type="checkbox" value="" id="customCheckboxSvg3" />
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom SVG Icon Checkbox -->
<!-- Custom Option Radio Image -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Options Radio With Images</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-image custom-option-image-radio">
<label class="form-check-label custom-option-content" for="customRadioImg1">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/3.jpg" alt="radioImg" />
</span>
</label>
<input
name="customRadioImage"
class="form-check-input"
type="radio"
value="customRadioImg1"
id="customRadioImg1"
checked />
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-image custom-option-image-radio">
<label class="form-check-label custom-option-content" for="customRadioImg2">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/8.jpg" alt="radioImg" />
</span>
</label>
<input
name="customRadioImage"
class="form-check-input"
type="radio"
value="customRadioImg2"
id="customRadioImg2" />
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-image custom-option-image-radio">
<label class="form-check-label custom-option-content" for="customRadioImg3">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/5.jpg" alt="radioImg" />
</span>
</label>
<input
name="customRadioImage"
class="form-check-input"
type="radio"
value="customRadioImg3"
id="customRadioImg3" />
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom Option Radio Image -->
<!-- Custom Option Checkbox Image -->
<div class="col-xl-6">
<div class="card">
<h5 class="card-header">Custom Options Checkbox With Images</h5>
<div class="card-body">
<div class="row">
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-image custom-option-image-check">
<input class="form-check-input" type="checkbox" value="" id="customCheckboxImg1" checked />
<label class="form-check-label custom-option-content" for="customCheckboxImg1">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/2.jpg" alt="cbImg" />
</span>
</label>
</div>
</div>
<div class="col-md mb-md-0 mb-5">
<div class="form-check custom-option custom-option-image custom-option-image-check">
<input class="form-check-input" type="checkbox" value="" id="customCheckboxImg2" />
<label class="form-check-label custom-option-content" for="customCheckboxImg2">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/6.jpg" alt="cbImg" />
</span>
</label>
</div>
</div>
<div class="col-md">
<div class="form-check custom-option custom-option-image custom-option-image-check">
<input class="form-check-input" type="checkbox" value="" id="customCheckboxImg3" />
<label class="form-check-label custom-option-content" for="customCheckboxImg3">
<span class="custom-option-body">
<img src="../../assets/img/backgrounds/10.jpg" alt="cbImg" />
</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /Custom Option Checkbox Image -->
</div>
<script>
// Check selected custom option
window.Helpers.initCustomOptionCheck();
</script>
</div>
<!--/ Content -->
<!-- Footer -->
<footer class="content-footer footer bg-footer-theme">
<div class="container-xxl">
<div
class="footer-container d-flex align-items-center justify-content-between py-4 flex-md-row flex-column">
<div class="text-body">
©
<script>
document.write(new Date().getFullYear());
</script>
, made with ❤️ by
<a href="https://themeselection.com" target="_blank" class="footer-link">ThemeSelection</a>
</div>
<div class="d-none d-lg-inline-block">
<a href="https://themeselection.com/license/" class="footer-link me-4" target="_blank">License</a>
<a href="https://themeselection.com/" target="_blank" class="footer-link me-4">More Themes</a>
<a
href="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/documentation/"
target="_blank"
class="footer-link me-4"
>Documentation</a
>
<a
href="https://themeselection.com/support/"
target="_blank"
class="footer-link d-none d-sm-inline-block"
>Support</a
>
</div>
</div>
</div>
</footer>
<!-- / Footer -->
<div class="content-backdrop fade"></div>
</div>
<!--/ Content wrapper -->
</div>
<!--/ Layout container -->
</div>
</div>
<!-- Overlay -->
<div class="layout-overlay layout-menu-toggle"></div>
<!-- Drag Target Area To SlideIn Menu On Small Screens -->
<div class="drag-target"></div>
<!--/ Layout wrapper -->
<!-- Core JS -->
<!-- build:js assets/vendor/js/core.js -->
<script src="../../assets/vendor/libs/jquery/jquery.js"></script>
<script src="../../assets/vendor/libs/popper/popper.js"></script>
<script src="../../assets/vendor/js/bootstrap.js"></script>
<script src="../../assets/vendor/libs/perfect-scrollbar/perfect-scrollbar.js"></script>
<script src="../../assets/vendor/libs/hammer/hammer.js"></script>
<script src="../../assets/vendor/libs/i18n/i18n.js"></script>
<script src="../../assets/vendor/libs/typeahead-js/typeahead.js"></script>
<script src="../../assets/vendor/js/menu.js"></script>
<!-- endbuild -->
<!-- Vendors JS -->
<!-- Main JS -->
<script src="../../assets/js/main.js"></script>
<!-- Page JS -->
</body>
</html>