<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description"
        content="Cuba admin is super flexible, powerful, clean &amp; modern responsive bootstrap 5 admin template with unlimited possibilities.">
    <meta name="keywords"
        content="admin template, Cuba admin template, dashboard template, flat admin template, responsive admin template, web app">
    <meta name="author" content="pixelstrap">
    <link rel="icon" href="{{ asset('assets/images/favicon.png') }}" type="image/x-icon">
    <link rel="shortcut icon" href="{{ asset('assets/images/favicon.png') }}" type="image/x-icon">
    <title>Cuba - Premium Admin Template</title>
    <!-- Google font-->
    <link href="https://fonts.googleapis.com/css?family=Rubik:400,400i,500,500i,700,700i&amp;display=swap"
        rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900&amp;display=swap"
        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=Caveat:wght@700&amp;display=swap" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/fontawesome.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/icofont.css') }}">
    <link rel="icon" href="{{ asset('assets/svg/landing-icons.svg') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/slick.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/slick-theme.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/animate.css') }}">
    <!-- Bootstrap css-->
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/vendors/bootstrap.css') }}">
    <!-- App css-->
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/style.css') }}">
    <!-- Responsive css-->
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/responsive.css') }}">
</head>

<body class="landing-page">
    <!-- tap on top starts-->
    <div class="tap-top"><i data-feather="chevrons-up"></i></div>
    <!-- tap on tap ends-->
    <!-- page-wrapper Start-->
    <div class="landing-page">
        <!-- Page Body Start-->
        <div class="landing-home">
            <div class="container-fluid">
                <div class="sticky-header">
                    <header>
                        <nav class="navbar navbar-b navbar-dark navbar-trans navbar-expand-xl fixed-top nav-padding"
                            id="sidebar-menu"><a class="navbar-brand p-0" href="#"><img class="img-fluid"
                                    src="{{ asset('assets/images/landing/landing_logo.png') }}" alt=""></a>
                            <button class="navbar-toggler navabr_btn-set custom_nav" type="button"
                                data-bs-toggle="collapse" data-bs-target="#navbarDefault" aria-controls="navbarDefault"
                                aria-expanded="false"
                                aria-label="Toggle navigation"><span></span><span></span><span></span></button>
                            <div class="navbar-collapse justify-content-center collapse hidenav" id="navbarDefault">
                                <ul class="navbar-nav navbar_nav_modify" id="scroll-spy">
                                    <li class="nav-item"><a class="nav-link" href="#layout">Layouts</a></li>
                                    <li class="nav-item"><a class="nav-link" href="#applications">Applications</a></li>
                                    <li class="nav-item"><a class="nav-link" href="#documentation">Documentation</a>
                                    </li>
                                    <li class="nav-item"><a class="nav-link" href="#landings">Landings</a></li>
                                    <li class="nav-item"><a class="nav-link" href="#faq">Faq</a></li>
                                    <li class="nav-item"><a class="nav-link"
                                            href="https://www.pixelstrap.com/hire-us">Hire Us</a></li>
                                    <li class="nav-item"><a class="nav-link" href="https://www.pixelstrap.com/"
                                            target="_blank">Premium theme</a></li>
                                </ul>
                            </div>
                            <div class="buy-btn rounded-pill"><a class="nav-link js-scroll"
                                    href="https://1.envato.market/3GVzd" target="_blank">Buy Now</a></div>
                        </nav>
                    </header>
                </div>
                <div class="row justify-content-center">
                    <div class="col-lg-8 col-sm-10">
                        <div class="content text-center">
                            <div>
                                <h6 class="content-title"><img class="arrow-decore"
                                        src="{{ asset('assets/images/landing/decore/arrow.svg') }}" alt=""><span
                                        class="sub-title">Introducing </span></h6>
                                <h1 class="wow fadeIn">Scalable Admin template with <span>trending </span> designs</h1>
                                <p class="mt-3 wow fadeIn">Welcome to Cuba - the leading landing page templates, built
                                    with React, Angular, flask & Vue. No jQuery!</p>
                                <div class="btn-grp mt-4"><a class="wow pulse" href="index.html" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="HTML"> <img
                                            src="{{ asset('assets/images/landing/icon/html/html.png') }}" alt=""></a><a
                                        class="wow pulse" href="https://angular.pixelstrap.com/cuba/" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Angular 16"> <img
                                            src="{{ asset('assets/images/landing/icon/angular/angular.png') }}"
                                            alt=""></a><a class="wow pulse"
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Vue 3"> <img
                                            src="{{ asset('assets/images/landing/icon/vue/vue.png') }}" alt=""></a><a
                                        class="wow pulse" href="https://laravel.pixelstrap.com/cuba/dashboard/index"
                                        target="_blank" data-bs-placement="top" data-bs-toggle="tooltip"
                                        title="Laravel 10"> <img
                                            src="{{ asset('assets/images/landing/icon/laravel/laravel.png') }}"
                                            alt=""></a><a class="wow pulse"
                                        href="https://cubadjango.pixelstrap.com/" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Django 4.0.4"> <img
                                            src="../assets/images/landing/icon/django/django.png"
                                            alt=""></a><a class="wow pulse"
                                        href="http://cubaflask.pixelstrap.com/" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Flask 2.2.2"> <img
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a><a
                                        class="wow pulse" href="https://react.pixelstrap.com/cuba-context/"
                                        target="_blank" data-bs-placement="top" data-bs-toggle="tooltip"
                                        title="React Context"><img src="../assets/images/landing/icon/react/react.png"
                                            alt=""></a><a class="wow pulse"
                                        href="https://php.pixelstrap.com/cuba/dubai.php" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="PHP"> <img
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a><a
                                        class="wow pulse" href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank" data-bs-placement="top" data-bs-toggle="tooltip"
                                        title="Codeigniter"> <img
                                            src="../assets/images/landing/icon/codeigniter/codeigniter-icon.png"
                                            alt=""></a><a class="wow pulse"
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Node"> <img
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a><a
                                        class="wow pulse" href="javascript:void(0)" data-bs-placement="top"
                                        data-bs-toggle="tooltip" title="Coming soon"> <img
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a><a
                                        class="wow pulse" href="https://cuba-nuxt.vercel.app/" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title="Nuxt"> <img
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a><a
                                        class="wow pulse"
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=dubai" target="_blank"
                                        data-bs-placement="top" data-bs-toggle="tooltip" title=".Net Core 7"> <img
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a><a
                                        class="wow pulse"
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=dubai"
                                        target="_blank" data-bs-placement="top" data-bs-toggle="tooltip"
                                        title="Next js"> <img src="../assets/images/landing/stroke-icon/15.svg"
                                            alt=""></a><a class="wow pulse"
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Dubai"
                                        target="_blank" data-bs-placement="top" data-bs-toggle="tooltip"
                                        title="Svelte"> <img src="../assets/images/landing/stroke-icon/16.png"
                                            alt=""></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-7 col-lg-8 col-md-10"> <img class="screen1 img-fluid"
                            src="../assets/images/landing/screen1.png" alt=""></div>
                </div>
            </div>
        </div>
        <section class="section-space premium-wrap">
            <div class="container">
                <ul class="decoration">
                    <li class="flower-gif">
                        <div class="mesh-loader">
                            <div class="set-one">
                                <div class="circle"></div>
                                <div class="circle"></div>
                            </div>
                            <div class="set-two">
                                <div class="circle"></div>
                                <div class="circle"></div>
                            </div>
                        </div>
                    </li>
                    <li class="wavy-gif">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251 38">
                            <path fill="none" stroke-width="10" stroke-miterlimit="10"
                                d="M0,9C17.93,9,17.93,29,35.85,29S53.78,9,71.71,9s17.92,20,35.85,20S125.49,9,143.42,9s17.93,20,35.86,20S197.21,9,215.14,9,233.07,29,251,29">
                            </path>
                        </svg>
                    </li>
                </ul>
                <div class="row justify-content-center">
                    <div class="col-sm-12">
                        <div class="landing-title">
                            <h5 class="sub-title">Faster, Lighter & Dev. Friendly</h5>
                            <h2> <span class="gradient-1">Benefits </span> of cuba</h2>
                            <p>Cuba admin template is a premium and clean admin template. it is a complete platform for
                                base apps or dashboards, with many pre-built screens included. </p>
                        </div>
                        <div class="vector-image"> <img src="../assets/images/landing/vectors/1.svg" alt="">
                        </div>
                    </div>
                    <div class="col-xxl-8">
                        <div class="row g-lg-5 g-3">
                            <div class="col-md-3 col-6">
                                <div class="benefit-box pink">
                                    <svg>
                                        <use href="../assets/svg/landing-icons.svg#tag"></use>
                                    </svg>
                                    <h2 class="mb-0">4,620</h2>
                                    <h6 class="mb-0">Sales</h6>
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="benefit-box purple">
                                    <svg>
                                        <use href="../assets/svg/landing-icons.svg#ratings"></use>
                                    </svg>
                                    <h2 class="mb-0">4,088</h2>
                                    <h6 class="mb-0">5 Stars Ratings</h6>
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="benefit-box red">
                                    <svg>
                                        <use href="../assets/svg/landing-icons.svg#user_circle"></use>
                                    </svg>
                                    <h2 class="mb-0">3K</h2>
                                    <h6 class="mb-0">End Users</h6>
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="benefit-box warning">
                                    <svg>
                                        <use href="../assets/svg/landing-icons.svg#gear"></use>
                                    </svg>
                                    <h2 class="mb-0">6 Years</h2>
                                    <h6 class="mb-0">Development</h6>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space cuba-demo-section layout pt-0" id="layout">
            <div class="container">
                <ul class="decoration">
                    <li class="line-gif"><img src="../assets/images/landing/gifs/3.gif" alt=""></li>
                    <li class="wavy-line-gif"><img src="../assets/images/landing/gifs/4.gif" alt=""></li>
                </ul>
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="cuba-demo-content">
                            <div class="couting">
                                <h2>12</h2>
                            </div>
                            <div class="landing-title">
                                <h5 class="sub-title">Trending & Clean Design Collection</h5>
                                <h2> <span class="gradient-2">Creative & unique </span> Admin layouts</h2>
                                <p>We are providing 12 different layouts only on one click.there are no different
                                    folders for each layouts.VueJS, React, Angular, Laravel, Html, Django Admin
                                    Dashboard Template</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="container-fluid fluid-space">
                <div class="row demo-imgs g-xl-5 g-sm-3">
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 1 - </span>Dubai</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/dubai.jpg" alt="default"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="default-view" href="index.html"
                                        data-attr="default" target="_blank"> <img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Dubai"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Dubai"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=dubai"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a href="https://cubaflask.pixelstrap.com/index?layout_type=dubai"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Dubai"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/dubai.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/compact-sidebar"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=dubai"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=dubai"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/" target="_blank"><img
                                            class="img-fluid" src="../assets/images/landing/stroke-icon/14.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=dubai"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Dubai"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 2 - </span>Paris</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/paris.jpg" alt="classicSidebar"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html paris-view"
                                        href="index.html?layout=paris" target="_blank" data-attr="dark-sidebar"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Paris"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Paris"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=paris"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a href="https://cubaflask.pixelstrap.com/index?layout_type=paris"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Paris"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/paris.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/dark-sidebar"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=paris"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=paris"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Paris"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=paris"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Paris"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 3 - </span>Los Angeles</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/los-angle.png" alt="material"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html los-view"
                                        href="index.html?layout=los_angeles" target="_blank"
                                        data-attr="material-layout"> <img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=LosAngeles"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=LosAngeles"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=los_angeles"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=los_angeles"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/LosAngeles"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/los-angeles.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/material-layout"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=los_angeles"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=losangeles"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=LosAngeles"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=losangeles"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=LosAngeles"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 4 - </span>Tokyo</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/tokyo.jpg" alt="compact"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html tokyo-view"
                                        href="index.html?layout=tokyo" target="_blank" data-attr="compact-wrap"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Tokyo"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Tokyo"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=tokyo"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a href="https://cubaflask.pixelstrap.com/index?layout_type=tokyo"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Tokyo"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/tokyo.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/compact-wrap"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=tokyo"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=tokyo"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Tokyo"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=tokyo"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Tokyo"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 5 - </span>Moscow</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/moscow.jpg" alt="collapse"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html moscow-view"
                                        href="index.html?layout=moscow" target="_blank"
                                        data-attr="compact-small"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Moscow"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Moscow"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=moscow"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a href="https://cubaflask.pixelstrap.com/index?layout_type=moscow"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Moscow"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/moscow.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/compact-small"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=moscow"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=moscow"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Moscow"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=moscow"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Moscow"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 6 - </span>Singapore</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/singapore.jpg" alt="enterprise">
                            </div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html singapore-view"
                                        href="index.html?layout=singapore" target="_blank"
                                        data-attr="enterprice-type"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Singapore"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Singapore"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=singapore"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=singapore"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Singapore"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/singapore.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/enterprice-type"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=singapore"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=singapore"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Singapore"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=singapore"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Singapore"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 7 - </span>New York</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"> <img class="img-fluid"
                                    src="../assets/images/landing/layout-images/newyork.png" alt="centralize"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html newyork-view"
                                        href="index.html?layout=new_york" target="_blank"
                                        data-attr="box-layout"><img src="../assets/images/landing/stroke-icon/1.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=NewYork"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=NewYork"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=new_york"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=new_york"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/NewYork"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/newyork.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/box-layout"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=new_york"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=newyork"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=NewYork"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=newyork"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=NewYork"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 8 - </span>Barcelona</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/barcelona.jpg" alt="further"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html barcelona-view"
                                        href="index.html?layout=barcelona" target="_blank"
                                        data-attr="advance-type"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Barcelona"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Barcelona"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=barcelona"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=barcelona"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Barcelona"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/barcelona.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/advance-type"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=barcelona"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=barcelona"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Barcelona"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=barcelona"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Barcelona"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 9 - </span>Madrid</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/madrid.jpg" alt="revolutionary">
                            </div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html madrid-view"
                                        href="index.html?layout=madrid" target="_blank"
                                        data-attr="color-sidebar"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Madrid"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Madrid"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=madrid"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=madrid"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Madrid"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/madrid.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/color-sidebar"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=madrid"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=madrid"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Madrid"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=madrid"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Madrid"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 10 - </span>Rome</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/rome.jpg" alt="statistics"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html rome-view"
                                        href="index.html?layout=rome" target="_blank"
                                        data-attr="material-icon"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Rome"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Rome"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=rome"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a href="https://cubaflask.pixelstrap.com/index?layout_type=rome"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Rome"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/rome.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/material-icon"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=rome"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=rome"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Rome"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=rome"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Rome"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 11 - </span>Seoul</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/seoul.jpg" alt="trendy"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html seoul-view"
                                        href="index.html?layout=seoul" target="_blank"
                                        data-attr="modern-layout"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Seoul"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Seoul"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a
                                        href="https://cubadjango.pixelstrap.com/index?layout_type=seoul"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=seoul"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/Seoul"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/seoul.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/modern-layout"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=seoul"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=seoul"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=Seoul"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=seoul"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=Seoul"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6 demo-content">
                        <div class="cuba-demo-img">
                            <ul class="dot-group">
                                <li></li>
                                <li></li>
                                <li></li>
                            </ul>
                            <div class="title-wrapper">
                                <h3 class="theme-name mb-0"> <span>Demo 12 - </span>London</h3>
                                <svg class="title-svg" width="51" height="13" viewBox="0 0 51 13"
                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path fill-rule="evenodd" clip-rule="evenodd"
                                        d="M45.441 5.23769C45.1147 5.6996 44.7795 6.29315 44.4287 6.79516C44.0566 7.32282 43.6848 7.82319 43.4063 8.39596C42.3695 10.5523 44.9675 9.32014 45.564 8.02855C46.1179 6.84286 46.9246 5.87434 47.5859 4.84618C47.7395 4.60397 47.9033 4.26383 48.0568 4.02163C48.5763 3.17147 49.2516 2.53511 49.937 1.82812C50.1291 1.63094 51.1206 0.323924 50.2276 0.271093C49.8167 0.249553 48.2922 0.5361 47.7883 0.639651C46.0126 0.994835 44.8002 0.761651 43.2136 0.879502C41.3566 1.01618 40.2674 1.03208 39.4223 2.48705C38.6443 3.82331 39.9175 3.32601 40.6023 3.28698C40.9682 3.2651 42.689 3.16192 42.8406 3.24726C41.0738 4.30895 39.0645 5.02824 37.0996 5.92744C35.3375 6.72902 32.5247 7.59153 30.5216 8.08443C26.1768 9.14676 21.4529 9.72998 17.427 9.37823C11.8143 8.89224 6.34249 7.27448 2.66916 3.3266C2.36354 3.00658 1.08682 1.31053 0.829574 1.29887C-0.0667404 1.26048 0.320466 3.42074 0.776292 4.07177C2.88672 7.11634 6.19576 9.41621 9.11681 10.5305C12.2801 11.735 16.1782 12.6293 20.1937 12.5475C25.0767 12.443 28.6501 11.8499 33.6912 10.4322C36.8488 9.54622 39.9123 8.1382 42.764 6.70735C43.2704 6.44645 45.1753 5.30309 45.441 5.23769Z"
                                        fill="#41B883"></path>
                                </svg>
                            </div>
                            <div class="overflow-hidden"><img class="img-fluid"
                                    src="../assets/images/landing/layout-images/landon.png" alt="blank"></div>
                            <div class="hover-link">
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="HTML with bootstrap 5"><a class="html landon-view"
                                        href="index.html?layout=london" target="_blank"
                                        data-attr="default-body"><img
                                            src="../assets/images/landing/stroke-icon/1.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Vue 3"><a
                                        href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=London"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/3.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Angular 16"><a
                                        href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=London"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/2.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Django 4.0.4"><a href="https://cubadjango.pixelstrap.com/index"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/6.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Flask"><a
                                        href="https://cubaflask.pixelstrap.com/index?layout_type=london"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/7.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="React Context"><a
                                        href="https://react.pixelstrap.com/cuba-context/dashboard/default/London"
                                        target="_blank"> <img src="../assets/images/landing/stroke-icon/4.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="PHP"><a href="https://php.pixelstrap.com/cuba/london.php"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/8.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Laravel 10"><a
                                        href="https://laravel.pixelstrap.com/cuba/layouts/default-body"
                                        target="_blank"><img src="../assets/images/landing/stroke-icon/5.svg"
                                            alt=""></a></div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nodejs"><a
                                        href="https://cuba-nodejs-pixelstrap.herokuapp.com/index?layout_type=london"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/10.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Codeigniter"><a href="https://codeigniter.pixelstrap.com/cuba/public/"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/9.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Coming soon"><a href="javascript:void(0)"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/12.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title=".Net Core 7"><a
                                        href="http://cubanet.pixelstrap.com/Dashboard/Index?id=london"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/13.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Nuxt"><a href="https://cuba-nuxt.vercel.app/?layout=London"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/14.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Next js"><a
                                        href="https://cuba-nextjs.vercel.app/dashboard/default?layout=london"
                                        target="_blank"> <img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/15.svg" alt=""></a>
                                </div>
                                <div class="link-btn" data-bs-toggle="tooltip" data-bs-placement="top"
                                    title="Svelte"><a
                                        href="https://cuba-svelte.vercel.app/dashboard/default?layout=London"
                                        target="_blank"><img class="img-fluid"
                                            src="../assets/images/landing/stroke-icon/16.png" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space customer-support">
            <div class="container">
                <ul class="decoration d-sm-block d-none">
                    <li class="round-gif"><img src="../assets/images/landing/gifs/5.gif" alt=""></li>
                </ul>
                <div class="row justify-content-center">
                    <div class="col-sm-12">
                        <div class="landing-title text-center">
                            <div class="rating-title gap-2"><img class="decore-1"
                                    src="../assets/images/landing/decore/arrow-3.svg" alt="">
                                <ul class="d-flex ratings gap-1">
                                    <li> <i class="fa fa-star"></i></li>
                                    <li> <i class="fa fa-star"></i></li>
                                    <li> <i class="fa fa-star"></i></li>
                                    <li> <i class="fa fa-star"></i></li>
                                    <li> <i class="fa fa-star"></i></li>
                                </ul>
                                <h6 class="rating-title mb-0">4.5 <span class="f-light">(110 rating)</span></h6>
                            </div>
                            <h2> <span class="gradient-1">Thousands </span> of customers love us</h2>
                            <p>The marketer's goal is to help customers feel confident about their choice. Just
                                providing more information often doesn't help</p>
                        </div>
                    </div>
                    <div class="col-xxl-10">
                        <div class="row customer-wrap">
                            <div class="col-md-3 col-6">
                                <div class="customer-wrapper">
                                    <div class="customer-box"> <img src="../assets/images/landing/customers/1.svg"
                                            alt="">
                                        <h6 class="f-light mb-0 mt-2">Top rated template</h6>
                                    </div><img class="outline-box"
                                        src="../assets/images/landing/decore/arrow-style-1.svg" alt="">
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="customer-wrapper">
                                    <div class="customer-box"> <img src="../assets/images/landing/customers/2.svg"
                                            alt="">
                                        <h6 class="f-light mb-0 mt-2">Highest selling template</h6>
                                    </div><img class="outline-box"
                                        src="../assets/images/landing/decore/arrow-style-2.svg" alt="">
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="customer-wrapper">
                                    <div class="customer-box"> <img src="../assets/images/landing/customers/3.svg"
                                            alt="">
                                        <h6 class="f-light mb-0 mt-2">Super easy to deploy</h6>
                                    </div><img class="outline-box"
                                        src="../assets/images/landing/decore/arrow-style-3.svg" alt="">
                                </div>
                            </div>
                            <div class="col-md-3 col-6">
                                <div class="customer-wrapper">
                                    <div class="customer-box"> <img src="../assets/images/landing/customers/4.svg"
                                            alt="">
                                        <h6 class="f-light mb-0 mt-2">Fast Customer Support</h6>
                                    </div><img class="outline-box"
                                        src="../assets/images/landing/decore/arrow-style-4.svg" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="customization-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-lg-6">
                        <div class="landing-title text-start">
                            <h5 class="sub-title">Theme Customization</h5>
                            <h2> <span class="gradient-3">Real-time </span> customization & preview</h2>
                            <p class="m-0">The live customizer offers everything you need to customize.there is no
                                coding required.</p>
                        </div>
                        <div class="customization-accordion">
                            <div class="accordion" id="accordionExample">
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingOne">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#collapseOne"
                                            aria-expanded="false" aria-controls="collapseOne">Sidebar
                                            Builder</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="collapseOne"
                                        aria-labelledby="headingOne" data-bs-parent="#accordionExample">
                                        <div class="accordion-body f-light">Cuba admin provide two types of sidebar
                                            variation which is horizontal and vertical sidebar.you can check sidebar
                                            type customization option in our template</div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingTwo">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                            data-bs-target="#collapseTwo" aria-expanded="true"
                                            aria-controls="collapseTwo">Unlimited color</button>
                                    </h2>
                                    <div class="accordion-collapse collapse show" id="collapseTwo"
                                        aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
                                        <div class="accordion-body f-light">Change primary and secondary theme colors
                                            using this customization option.we are providing this settings for primary
                                            and secondary colors</div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="headingThree">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#collapseThree"
                                            aria-expanded="false" aria-controls="collapseThree">Layout type</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="collapseThree"
                                        aria-labelledby="headingThree" data-bs-parent="#accordionExample">
                                        <div class="accordion-body f-light">
                                            Cuba admin provides two layouts which is rtl and box layout. Also supports
                                            dark layout.</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="customization-img"> <img class="img-fluid"
                                src="../assets/images/landing/customiztion.svg" alt=""></div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space app-section" id="applications">
            <div class="container-fluid fluid-space">
                <ul class="decoration">
                    <li class="wavy-gif">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251 38">
                            <path fill="none" stroke-width="10" stroke-miterlimit="10"
                                d="M0,9C17.93,9,17.93,29,35.85,29S53.78,9,71.71,9s17.92,20,35.85,20S125.49,9,143.42,9s17.93,20,35.86,20S197.21,9,215.14,9,233.07,29,251,29">
                            </path>
                        </svg>
                    </li>
                </ul>
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title">
                            <h5 class="sub-title">Trending & Clean Design Collection</h5>
                            <h2>
                                Fast & powerful <span class="gradient-4">Applications</span></h2>
                            <p>Cuba admin template provides 3 workable application and designs of other applications.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="row g-4">
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-1">
                            <h6><span class="app-title">Social App</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/social-app.html" target="_blank"><img
                                            class="img-fluid cuba-img" src="../assets/images/landing/social-app.jpg"
                                            alt=""></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-2">
                            <h6><span class="app-title">knowledgebase</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/knowledgebase.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/knowlagebase-app.jpg" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-3">
                            <h6><span class="app-title">kanban</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/kanban.html" target="_blank"><img
                                            class="img-fluid cuba-img"
                                            src="../assets/images/landing/apps/kanban.jpg" alt=""></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-4">
                            <h6><span class="app-title">Ecommerce</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/product-details.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/ecommerce-app.jpg" alt=""></a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-5 h-100">
                            <h6><span class="app-title">Chat</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/private-chat.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/apps/chat.jpg" alt=""></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-4 col-md-6">
                        <div class="app-box app-bg-6 h-100">
                            <h6><span class="app-title">File manager</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect"><a href="../template/file-manager.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/apps/file.jpg" alt=""></a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <marquee class="text-marqee" direction="left">
                <h2 class="big-title">Faster, Lighter & Friendly </h2>
            </marquee>
        </section>
        <section class="section-space feature-section pt-0">
            <ul class="decoration">
                <li class="round-gif"><img src="../assets/images/landing/gifs/5.gif" alt=""></li>
            </ul>
            <div class="container">
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title">
                            <h5 class="sub-title">Why you choose Cuba</h5>
                            <h2>
                                Introducing our <span class="gradient-5">Core Features</span></h2>
                            <p>Many more amazing features are available in cuba admin template and also clean
                                responsive.we are using scss 7-1 tire folder structure for this admin template.</p>
                        </div>
                        <div class="vector-image"> <img src="../assets/images/landing/vectors/2.svg"
                                alt="vector women"></div>
                    </div>
                </div>
                <div class="row g-4">
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-1">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/1.svg"
                                    alt=""></div>
                            <h5>Quality & Clean Code</h5>
                            <p class="mb-0 f-light">All you need to know of using clean code as a manager to make your
                                team and your software awesome. </p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-2">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/2.svg"
                                    alt=""></div>
                            <h5>Bootstrap v5.0</h5>
                            <p class="mb-0 f-light">Bootstrap is a complete CSS framework.Bootstrap is built on
                                responsive 12-column grids, layouts, and components</p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-3">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/3.svg"
                                    alt=""></div>
                            <h5>Handmade Icons</h5>
                            <p class="mb-0 f-light">Let's learn how to use our own SVG icons in cuba admin
                                template.Icon System with SVG Sprites</p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-4">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/4.svg"
                                    alt=""></div>
                            <h5>Limitless Components</h5>
                            <p class="mb-0 f-light">The limitless layout collection and UI kit library is the biggest
                                collection of layouts for web design</p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-5">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/5.svg"
                                    alt=""></div>
                            <h5>Easy Customizable</h5>
                            <p class="mb-0 f-light">Easy Step-By-Step Guide for Beginners.customize your layout,
                                settings and content</p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-6">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/6.svg"
                                    alt=""></div>
                            <h5>Responsive & User-Friendly</h5>
                            <p class="mb-0 f-light">Use Responsive Design to Connect with all Device Users </p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-7">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/7.svg"
                                    alt=""></div>
                            <h5>Premium Support</h5>
                            <p class="mb-0 f-light">We are always be their for your support and you are facing some
                                issues you can create ticket.</p>
                        </div>
                    </div>
                    <div class="col-xxl-3 col-lg-4 col-sm-6">
                        <div class="feature-box common-card bg-feature-8">
                            <div class="feature-icon"> <img src="../assets/images/landing/feature-icon/8.svg"
                                    alt=""></div>
                            <h5>Colors Options</h5>
                            <p class="mb-0 f-light">Cuba provide unlimited main color option.other colors you can
                                change easily using scss variables</p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="build-section">
            <div class="container">
                <ul class="decoration">
                    <li class="loader-gif"><span class="loader-1"> </span></li>
                </ul>
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title text-start">
                            <h2>Build stunning and powerful landing page with <span class="gradient-6">customizable
                                    and easy </span> to understand.</h2><img class="title-img d-sm-block d-none"
                                src="../assets/images/landing/decore/arrow-4.svg" alt="">
                            <h4 class="d-sm-block d-none sub-title rotate-title mb-0">The Biggest template Collection
                                Ever Build.</h4>
                        </div>
                    </div>
                </div>
                <div class="row g-4">
                    <div class="col-md-6">
                        <div class="build-image"> <img src="../assets/images/landing/sale.png" alt="">
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="build-content text-end">
                            <p class="f-light mb-0">Create unique combinations using a variety of section blocks from
                                the ultimate collection of design created by world-class designers.import a pre-built
                                section block with a single click or save your own custom block to reuse on other pages.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space framework-section" id="frameworks">
            <div class="container">
                <ul class="decoration">
                    <li class="loader-line-gif"><img src="../assets/images/landing/gifs/6.gif" alt="">
                    </li>
                    <li class="wavy-gif">
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 251 38">
                            <path fill="none" stroke-width="10" stroke-miterlimit="10"
                                d="M0,9C17.93,9,17.93,29,35.85,29S53.78,9,71.71,9s17.92,20,35.85,20S125.49,9,143.42,9s17.93,20,35.86,20S197.21,9,215.14,9,233.07,29,251,29">
                            </path>
                        </svg>
                    </li>
                </ul>
                <div class="row">
                    <div class="col-sm-12">
                        <div class="landing-title">
                            <h5 class="sub-title">10+ frameworks available</h5>
                            <h2>Latest Updates in <span class="gradient-7">All Frameworks</span></h2>
                            <p>Html, Vue, Angular, React, Django, Laravel , Nodejs , Codeigniter , Flask, PHP all this
                                versions available in cuba admin template</p>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <ul class="nav nav-tabs frame-tab" id="myTab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <button class="nav-link active" id="html-tab" data-bs-toggle="tab"
                                    data-bs-target="#html" type="button" role="tab" aria-controls="html"
                                    aria-selected="true"><img src="{{ asset('assets/images/landing/icon/html/html.png') }}"
                                        alt=""><span>HTML</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="react-tab" data-bs-toggle="tab"
                                    data-bs-target="#react" type="button" role="tab" aria-controls="react"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/4.svg"
                                        alt=""><span>React</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="angular-tab" data-bs-toggle="tab"
                                    data-bs-target="#angular" type="button" role="tab"
                                    aria-controls="angular" aria-selected="false"><img
                                        src="{{ asset('assets/images/landing/icon/angular/angular.png') }}"
                                        alt=""><span>Angular</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="vue-tab" data-bs-toggle="tab"
                                    data-bs-target="#vue" type="button" role="tab" aria-controls="vue"
                                    aria-selected="false"><img src="{{ asset('assets/images/landing/icon/vue/vue.png') }}"
                                        alt=""><span>Vuejs</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="laravel-tab" data-bs-toggle="tab"
                                    data-bs-target="#laravel" type="button" role="tab"
                                    aria-controls="laravel" aria-selected="false"><img
                                        src="{{ asset('assets/images/landing/icon/laravel/laravel.png') }}"
                                        alt=""><span>Laravel</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="django-tab" data-bs-toggle="tab"
                                    data-bs-target="#django" type="button" role="tab"
                                    aria-controls="django" aria-selected="false"><img
                                        src="../assets/images/landing/icon/django/django.png"
                                        alt=""><span>Django</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="flask-tab" data-bs-toggle="tab"
                                    data-bs-target="#flask" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/7.svg"
                                        alt=""><span>Flask</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="nodejs-tab" data-bs-toggle="tab"
                                    data-bs-target="#nodejs" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/10.svg"
                                        alt=""><span>Node</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="symfony-tab" data-bs-toggle="tab"
                                    data-bs-target="#symfony" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/12.svg"
                                        alt=""><span>Symfony</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="php-tab" data-bs-toggle="tab"
                                    data-bs-target="#php" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/8.svg"
                                        alt=""><span>PHP</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="net-tab" data-bs-toggle="tab"
                                    data-bs-target="#net" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/13.svg"
                                        alt=""><span>.NET</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="nuxt-tab" data-bs-toggle="tab"
                                    data-bs-target="#nuxt" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/14.svg"
                                        alt=""><span>Nuxt</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="next-tab" data-bs-toggle="tab"
                                    data-bs-target="#next" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/icon/next/next.png"
                                        alt=""><span>Next js</span></button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="svelte-tab" data-bs-toggle="tab"
                                    data-bs-target="#svelte" type="button" role="tab"
                                    aria-selected="false"><img src="../assets/images/landing/stroke-icon/16.png"
                                        alt=""><span>Svelte</span></button>
                            </li>
                        </ul>
                        <div class="tab-content" id="myTabContent">
                            <div class="tab-pane fade show active" id="html" role="tabpanel"
                                aria-labelledby="html-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SCSS</h5>
                                                <p class="f-light">
                                                    The superset CSS makes it simple to develop and usefulness
                                                    with variables, selectors, and nesting.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/pug.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>PUG</h5>
                                                <p class="f-light">
                                                    Pug.js enables generating dynamic data and developing adaptable HTML
                                                    code.The overall productivity increases.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/npm.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>NPM</h5>
                                                <p class="f-light">Node.js source code or a pre-built installer for
                                                    your platform, and start developing today</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/gulp.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gulp</h5>
                                                <p class="f-light">It is a very useful tool that makes code
                                                    compilation simple, especially when creating back-end programmes.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">
                                                    To facilitate form access and modification, the fields and field
                                                    labels are
                                                    logically arranged.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex chart</h5>
                                                <p class="f-light">
                                                    It also has its own special characteristics that will make the data
                                                    genuinely interactive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">
                                                    It makes data visualisation simple. It offers 8 different chart
                                                    kinds, all of which are responsive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">
                                                    Chartist gives designers and developers the chance to make charts
                                                    that are cross-browser compatible.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apps</h5>
                                                <p class="f-light">
                                                    Assist you in building the most user-friendly, dynamic websites and
                                                    applications with cutting-edge designs</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You also have the option to enable animated
                                                    thumbnails from the settings. Zoom & Fullscreen.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icons</h5>
                                                <p class="f-light">We have provide 4 & 5 types of different icons.most
                                                    trending icons like font awesome, feather icons.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Layout</h5>
                                                <p class="f-light">Those that seamlessly adjust to different screen
                                                    sizes and responsive layouts for your business.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ui kits</h5>
                                                <p class="f-light">We are provide bunch of ui kits for create easy
                                                    design and reusable components</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="react" role="tabpanel"
                                aria-labelledby="react-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/hook.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React Hook</h5>
                                                <p class="f-light">A component has many different phases of its life,
                                                    react hook helps us to run some functionality at a particular phase.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/reactstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React Strap</h5>
                                                <p class="f-light">Designing will pure css is a hassle, React Strap
                                                    reduces this inconvenience and speeds up the designing process.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/noquery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>No Jquery</h5>
                                                <p class="f-light">JQuery interferes with javascript of react
                                                    sometimes.we made sure that it does'nt do that.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/redux.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Redux</h5>
                                                <p class="f-light">Used for state management. Helps with defining
                                                    global variables and manipulating them.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/chat.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chat</h5>
                                                <p class="f-light">A Design of a chat application has been given, so
                                                    that you can create your own chat app in your theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/animation.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Router Animation</h5>
                                                <p class="f-light">When the page in the theme changes it looks dull if
                                                    no animation has been given, but you won't find any dullness in this
                                                    theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/props_state.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>State and props</h5>
                                                <p class="f-light">To manage state between multiple components props
                                                    and state management tools has been used with good code structure.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/reactrouter.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React-Router</h5>
                                                <p class="f-light">Through react-router, by attaching different
                                                    components to different navigation routes.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/chart.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Amazing Chart</h5>
                                                <p class="f-light">Data visualization seems boring without them. To
                                                    provide more visually pleasing way to present data.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/map.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Map</h5>
                                                <p class="f-light">Frankly we would be lost without them. But no
                                                    worries, many of them are given in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/gallery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You have many pictures , we have ways to display
                                                    them. With multiple gallery options, managing pictures is now easy.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/application.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Application</h5>
                                                <p class="f-light">It doesn't end here, explore the theme and
                                                    discovery many amazing applications inside it.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="angular" role="tabpanel"
                                aria-labelledby="angular-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SCSS</h5>
                                                <p class="f-light">To make it easier of designers to style our
                                                    website. It allows us to use things like variables , inline imports
                                                    and many other things.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/2.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ng bootstrap</h5>
                                                <p class="f-light">Allowing us to write pre-made classes to style our
                                                    theme and also add some functionalities as well.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/4.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Router</h5>
                                                <p class="f-light">Router attaches components to some paths, through
                                                    this paths , components can now be viewed.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/5.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">Admin requires many pages with input fields to
                                                    enter and manage the data. Many forms styles and functionalities
                                                    related to it has been included.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex Chart</h5>
                                                <p class="f-light">To visualize data in more attractive manner, we
                                                    have provided Apex charts. Many different chart options are
                                                    available in apex chart.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">Not happy with just one chart option? We have got
                                                    more. Chart.js has also been given as an alternative to create
                                                    beautiful charts.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">You want more ha? We knew it, so we included
                                                    chartist charts as well. Now you won't run out of options that
                                                    easily.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/9.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Google maps</h5>
                                                <p class="f-light">Frankly we would be lost without them. But no
                                                    worries, many of them are given in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You have many pictures , we have ways to display
                                                    them. With multiple gallery options, managing pictures is now easy.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/11.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ecommerce</h5>
                                                <p class="f-light">Ecommerce is just one of theme. Explore our theme
                                                    and you will find multiple uses for it.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/12.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Firebase Auth</h5>
                                                <p class="f-light">Online database of Firebase has been used for
                                                    authentication, making authentication reliable and more secure.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/13.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Firebase crud</h5>
                                                <p class="f-light">Crud has been explained using a simple to-do
                                                    application and has been integrated with firebase/firestore.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/14.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chat</h5>
                                                <p class="f-light">A Design of a chat application has been given, so
                                                    that you can create your own chat app in your theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="vue" role="tabpanel" aria-labelledby="vue-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/firebase.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Firebase</h5>
                                                <p class="f-light">An online database , easier to use, easier to
                                                    maintain, with multiple different uses. We have used it for an
                                                    example of CRUD.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/nojquery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>No Jquery</h5>
                                                <p class="f-light">JQuery interferes with javascript of Vue
                                                    sometimes.we made sure that it does'nt do that. How? We have not
                                                    used it in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuebootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Vue Boostrap</h5>
                                                <p class="f-light">Allowing us to write pre-made classes to style our
                                                    theme and also add some functionalities as well.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuex.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Vuex</h5>
                                                <p class="f-light">Used for state management.Allowing us to access
                                                    variables stored in vuex anywhere.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/chart.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Charts</h5>
                                                <p class="f-light">A Design of a chat application has been given, so
                                                    that you can create your own chat app in your theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vueswiper.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Vue Swiper</h5>
                                                <p class="f-light">Used for making the site more interactive. more
                                                    efficiently to display data more less space and in a more visually
                                                    pleasing way.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuerouter.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Vue Router</h5>
                                                <p class="f-light">Vue Router attaches components to some paths,
                                                    through this paths , components can now be viewed.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuemasonary.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Vue Masonry</h5>
                                                <p class="f-light">Implementing vue Masonry in our gallery application
                                                    we have made it more attractive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuecli.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Vue cli</h5>
                                                <p class="f-light">You can create a vue project from scratch, writing
                                                    code in each page on your own.It creates vue project with multiple
                                                    files pre-written.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/animation.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Animation</h5>
                                                <p class="f-light">Just imagine a simple static file without anything
                                                    moving.Pretty boring right.we have included a few different
                                                    animations in it.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/rangeslider.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Range Slider</h5>
                                                <p class="f-light">To make use user has good experience even when
                                                    increasing or decreasing values, we have included many little
                                                    features like range slider.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/rtlsupport.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>RTL Support</h5>
                                                <p class="f-light">The language is written from right to left or left
                                                    to right, we have included rtl functionality.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="laravel" role="tabpanel"
                                aria-labelledby="laravel-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="{{ asset('assets/images/landing/icon/laravel/laravel.png') }}"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Laravel 10</h5>
                                                <p class="f-light">Laravel has been one of the most prevalent PHP
                                                    frameworks for a long time now</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/laravel/blade.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Blade View</h5>
                                                <p class="f-light">Blade is the simple, yet powerful templating engine
                                                    that is included with Laravel.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">
                                                    To facilitate form access and modification, the fields and field
                                                    labels are
                                                    logically arranged.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex chart</h5>
                                                <p class="f-light">
                                                    It also has its own special characteristics that will make the data
                                                    genuinely interactive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">
                                                    It makes data visualisation simple. It offers 8 different chart
                                                    kinds, all of which are responsive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">
                                                    Chartist gives designers and developers the chance to make charts
                                                    that are cross-browser compatible.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apps</h5>
                                                <p class="f-light">
                                                    Assist you in building the most user-friendly, dynamic websites and
                                                    applications with cutting-edge designs</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You also have the option to enable animated
                                                    thumbnails from the settings. Zoom & Fullscreen.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icons</h5>
                                                <p class="f-light">We have provide 4 & 5 types of different icons.most
                                                    trending icons like font awesome, feather icons.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Layout</h5>
                                                <p class="f-light">Those that seamlessly adjust to different screen
                                                    sizes and responsive layouts for your business.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ui kits</h5>
                                                <p class="f-light">We are provide bunch of ui kits for create easy
                                                    design and reusable components</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="django" role="tabpanel"
                                aria-labelledby="django-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/django.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Django 4</h5>
                                                <p class="f-light">With jinja pre installed with it, reusing code
                                                    requires no effort.And being python framework it makes you website
                                                    pretty secure.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5x</h5>
                                                <p class="f-light">To make designing process more simpler we have used
                                                    bootstrap, which provides pre-made classes with styles attached to
                                                    it, ready to use. </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/css.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>CSS</h5>
                                                <p class="f-light">Along with the bootstrap css, It was necessary to
                                                    use css files to implement some functionalities along with scss
                                                    files.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>sass</h5>
                                                <p class="f-light">We have used sass. It allows us to use things like
                                                    variables , inline imports and many other things.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/kit.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Starter-kit</h5>
                                                <p class="f-light">We have also included a starter kit so you have
                                                    some files already ready to use.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>40+ Ui kits</h5>
                                                <p class="f-light">While creating your custom website you might need
                                                    small components like range sliders, buttons etc. </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>8+layouts</h5>
                                                <p class="f-light">Considering multiple uses for our theme, many type
                                                    of settings have been used to create multiple page layouts.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/builders.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Builders</h5>
                                                <p class="f-light">We have given builders like form, page builders
                                                    where you can drag and drop small elements to create whole page or
                                                    forms.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icon sets</h5>
                                                <p class="f-light">we thought that just few icon sets wouldn't be
                                                    enough to create an amazing website, so we gave 7 sets of them to
                                                    choose from.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Forms</h5>
                                                <p class="f-light">Many forms styles and functionalities related to it
                                                    has been included in this theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/table.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Tables</h5>
                                                <p class="f-light">we need a way to display table and manage them, and
                                                    to do that we have included tables , and customization options for
                                                    them as well.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>17+apps</h5>
                                                <p class="f-light">It doesn't end here, explore the theme and
                                                    discovery many amazing applications inside it.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="flask" role="tabpanel"
                                aria-labelledby="flask-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/flask/flask.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Flask 2.2.2</h5>
                                                <p class="f-light">With jinja pre installed with it, reusing code
                                                    requires no effort.And being python framework it makes you website
                                                    pretty secure.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5x</h5>
                                                <p class="f-light">To make designing process more simpler we have used
                                                    bootstrap, which provides pre-made classes with styles attached to
                                                    it, ready to use. </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/css.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>CSS</h5>
                                                <p class="f-light">It was necessary to use css files to implement some
                                                    functionalities along with scss files.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SCSS</h5>
                                                <p class="f-light">we have used sass. It allows us to use things like
                                                    variables , inline imports and many other things.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>40+ Ui kits</h5>
                                                <p class="f-light">you might need small components like range sliders,
                                                    buttons etc. We have provided many different elements.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/kit.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Starter-kit</h5>
                                                <p class="f-light">We have also included a starter kit so you have
                                                    some files already ready to use.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>8+layouts</h5>
                                                <p class="f-light">Considering multiple uses for our theme, many type
                                                    of settings have been used to create multiple page layouts.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/builders.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Builders</h5>
                                                <p class="f-light">We have given builders like form, page builders
                                                    where you can drag and drop small elements to create whole page or
                                                    forms.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icon sets</h5>
                                                <p class="f-light">we thought that just few icon sets wouldn't be
                                                    enough to create an amazing website, so we gave 7 sets of them to
                                                    choose from.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Forms</h5>
                                                <p class="f-light">Many forms styles and functionalities related to it
                                                    has been included in this theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/table.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Tables</h5>
                                                <p class="f-light">we need a way to display table and manage them, and
                                                    to do that we have included tables , and customization options for
                                                    them as well.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/django/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>17+apps</h5>
                                                <p class="f-light">It doesn't end here, explore the theme and
                                                    discovery many amazing applications inside it.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="nodejs" role="tabpanel"
                                aria-labelledby="nodejs-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/10.svg"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Node.js</h5>
                                                <p class="f-light">It is amongst the best javascript runtime compiler,
                                                    which allows you to run javascript in you system without using any
                                                    browser.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/node/1.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Express.js</h5>
                                                <p class="f-light">Express is a light-weight framework of node js. We
                                                    get amazing functionalities out the box, which has been used
                                                    extensively in this theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/nojquery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>No Jquery</h5>
                                                <p class="f-light">JQuery interferes with javascript of react
                                                    sometimes.we made sure that it does'nt do that. How? We have not
                                                    used it in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/14.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chat</h5>
                                                <p class="f-light">A Design of a chat application has been given, so
                                                    that you can create your own chat app in your theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/chart.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Amazing Chart</h5>
                                                <p class="f-light">Data visualization seems boring without them. To
                                                    provide more visually pleasing way to present data.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/map.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Map</h5>
                                                <p class="f-light">Frankly we would be lost without them. But no
                                                    worries, many of them are given in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/gallery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You have many pictures , we have ways to display
                                                    them. With multiple gallery options, managing pictures is now easy.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/application.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Application</h5>
                                                <p class="f-light">It doesn't end here, explore the theme and
                                                    discovery many amazing applications inside it.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/node/2.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Ejs template engine</h5>
                                                <p class="f-light">With the help of ejs template engine, we can use
                                                    same html code repeatedly. Just create a single file and use it as
                                                    many time you want.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/node/2.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Express-ejs-layouts</h5>
                                                <p class="f-light">We have created layouts to set this default
                                                    components and just pass the content through it.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/4.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Router</h5>
                                                <p class="f-light">Through router, by attaching different components
                                                    to different navigation routes.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="symfony" role="tabpanel"
                                aria-labelledby="symfony-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/12.svg"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Symfony</h5>
                                                <p class="f-light">Symfony has been one of the most prevalent PHP
                                                    frameworks for a long time now</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/feature-icon/7.svg"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Twig template</h5>
                                                <p class="f-light">Twig reduces templates to simple, PHP code that has
                                                    been optimised. When compared to standard PHP code, the overhead was
                                                    significantly reduced.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">
                                                    To facilitate form access and modification, the fields and field
                                                    labels are
                                                    logically arranged.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex chart</h5>
                                                <p class="f-light">
                                                    It also has its own special characteristics that will make the data
                                                    genuinely interactive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">
                                                    It makes data visualisation simple. It offers 8 different chart
                                                    kinds, all of which are responsive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">
                                                    Chartist gives designers and developers the chance to make charts
                                                    that are cross-browser compatible.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apps</h5>
                                                <p class="f-light">
                                                    Assist you in building the most user-friendly, dynamic websites and
                                                    applications with cutting-edge designs</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You also have the option to enable animated
                                                    thumbnails from the settings. Zoom & Fullscreen.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icons</h5>
                                                <p class="f-light">We have provide 4 & 5 types of different icons.most
                                                    trending icons like font awesome, feather icons.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Layout</h5>
                                                <p class="f-light">Those that seamlessly adjust to different screen
                                                    sizes and responsive layouts for your business.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ui kits</h5>
                                                <p class="f-light">We are provide bunch of ui kits for create easy
                                                    design and reusable components</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="php" role="tabpanel" aria-labelledby="php-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/8.svg" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>PHP</h5>
                                                <p class="f-light">PHP is a server scripting language, and a powerful
                                                    tool for making dynamic and interactive Web pages.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">
                                                    To facilitate form access and modification, the fields and field
                                                    labels are
                                                    logically arranged.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex chart</h5>
                                                <p class="f-light">
                                                    It also has its own special characteristics that will make the data
                                                    genuinely interactive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">
                                                    It makes data visualisation simple. It offers 8 different chart
                                                    kinds, all of which are responsive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">
                                                    Chartist gives designers and developers the chance to make charts
                                                    that are cross-browser compatible.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apps</h5>
                                                <p class="f-light">
                                                    Assist you in building the most user-friendly, dynamic websites and
                                                    applications with cutting-edge designs</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You also have the option to enable animated
                                                    thumbnails from the settings. Zoom & Fullscreen.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icons</h5>
                                                <p class="f-light">We have provide 4 & 5 types of different icons.most
                                                    trending icons like font awesome, feather icons.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Layout</h5>
                                                <p class="f-light">Those that seamlessly adjust to different screen
                                                    sizes and responsive layouts for your business.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ui kits</h5>
                                                <p class="f-light">We are provide bunch of ui kits for create easy
                                                    design and reusable components</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="net" role="tabpanel" aria-labelledby="net-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SCSS</h5>
                                                <p class="f-light">
                                                    The superset CSS makes it simple to develop and usefulness
                                                    with variables, selectors, and nesting.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/net-core.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>.NET core 7</h5>
                                                <p class="f-light">
                                                    .NET 7 is now released! ASP.NET Core in .NET 7 includes
                                                    everythingyou need to build rich modern web UI and powerful back-end
                                                    services.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/mvc-pattern.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>MVC Pattern</h5>
                                                <p class="f-light">
                                                    User requests are routed to a Controller which is responsiblefor
                                                    working with the Model to perform user actions and/or retrieve
                                                    results of queries. </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/forms.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Form</h5>
                                                <p class="f-light">
                                                    To facilitate form access and modification, the fields and field
                                                    labels are
                                                    logically arranged.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/6.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apex chart</h5>
                                                <p class="f-light">
                                                    It also has its own special characteristics that will make the data
                                                    genuinely interactive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/7.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chart.js</h5>
                                                <p class="f-light">
                                                    It makes data visualisation simple. It offers 8 different chart
                                                    kinds, all of which are responsive.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Chartist</h5>
                                                <p class="f-light">
                                                    Chartist gives designers and developers the chance to make charts
                                                    that are cross-browser compatible.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/apps.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Apps</h5>
                                                <p class="f-light">
                                                    Assist you in building the most user-friendly, dynamic websites and
                                                    applications with cutting-edge designs</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You also have the option to enable animated
                                                    thumbnails from the settings. Zoom & Fullscreen.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/iconset.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Icons</h5>
                                                <p class="f-light">We have provide 4 & 5 types of different icons.most
                                                    trending icons like font awesome, feather icons.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/layout.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Layout</h5>
                                                <p class="f-light">Those that seamlessly adjust to different screen
                                                    sizes and responsive layouts for your business.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/uikits.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Ui kits</h5>
                                                <p class="f-light">We are provide bunch of ui kits for create easy
                                                    design and reusable components</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="nuxt" role="tabpanel"
                                aria-labelledby="nuxt-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/14.svg"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Nuxt 3</h5>
                                                <p class="f-light">
                                                    The superset CSS makes it simple to develop and usefulness
                                                    with variables, selectors, and nesting.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/14.svg"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SSR-TRUE</h5>
                                                <p class="f-light">For better SEO and quick response server rendering
                                                    makes your website super-fast and easily searchable.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/nuxt/swiper.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Swiper</h5>
                                                <p class="f-light">Used for making the site more interactive. more
                                                    efficiently to display data more less space and in a more visually
                                                    pleasing way.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/rtlsupport.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Rtl Support</h5>
                                                <p class="f-light">The language is written from right to left or left
                                                    to right, we have included rtl functionality.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/nojquery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>No Jquery</h5>
                                                <p class="f-light">JQuery interferes with javascript of nuxt
                                                    sometimes.we made sure that it does'nt do that. How? We have not
                                                    used it in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/nuxt/1.svg" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Pinia</h5>
                                                <p class="f-light">Used for state management. Helps with defining
                                                    global variables and manipulating them.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/bootstrap.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Bootstrap 5</h5>
                                                <p class="f-light">
                                                    It is designed to generate responsive front-end web development that
                                                    is mobile-friendly.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SCSS</h5>
                                                <p class="f-light">The superset CSS makes it simple to develop and
                                                    usefulness with variables, selectors, and nesting.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/10.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>vue-easy-lightbox</h5>
                                                <p class="f-light">Used for accessing images in full screen and
                                                    implementing gallery.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/vue/vuemasonary.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>vue-toastification 2.0.0-rc.5</h5>
                                                <p class="f-light">Use your custom components or JSX as the toast body
                                                    for endless possibilities!</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/angular/8.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>vue-apexcharts</h5>
                                                <p class="f-light">A Design of a chat application has been given, so
                                                    that you can create your own chat app in your theme. </p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="next" role="tabpanel"
                                aria-labelledby="next-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/react-i18-next.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React-i18-next</h5>
                                                <p class="f-light">In cuba project, I utilised react-i18next to
                                                    internationalise my application and make it accessible in other
                                                    languages.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/react-next.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React Strap</h5>
                                                <p class="f-light">Designing will pure css is a hassle, React Strap
                                                    reduces this inconvenience and speeds up the designing process.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/noquery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>No Jquery</h5>
                                                <p class="f-light">JQuery interferes with javascript of react
                                                    sometimes.we made sure that it does'nt do that.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/react-next.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>React Context</h5>
                                                <p class="f-light">React context API is a built-in React feature that
                                                    allows you to manage state globally without having to pass props
                                                    down through the component tree.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/login.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Simple Login</h5>
                                                <p class="f-light">To guarantee that only logged-in users may access
                                                    features, cuba-nextjs used the simple-login authentication
                                                    middleware.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/typescript.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Typescript</h5>
                                                <p class="f-light">In cuba, used TypeScript to give JavaScript code
                                                    type safety.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/react-next.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Nossr</h5>
                                                <p class="f-light">NoSSR was used in cuba project to enhance
                                                    performance and lessen the volume of data that must be given to the
                                                    client.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/next/next.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Next-Router</h5>
                                                <p class="f-light">Next-router is a file-system based router built on
                                                    top of Server Components that supports layouts, nested routing,
                                                    loading states, error handling, and more.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/chart.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Amazing Chart</h5>
                                                <p class="f-light">Data visualization seems boring without them. To
                                                    provide more visually pleasing way to present data.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/map.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Map</h5>
                                                <p class="f-light">Frankly we would be lost without them. But no
                                                    worries, many of them are given in our theme.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/gallery.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Gallery</h5>
                                                <p class="f-light">You have many pictures , we have ways to display
                                                    them. With multiple gallery options, managing pictures is now easy.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/react/application.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Application</h5>
                                                <p class="f-light">It doesn't end here, explore the theme and
                                                    discovery many amazing applications inside it.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="svelte" role="tabpanel"
                                aria-labelledby="svelte-tab">
                                <div class="row g-xxl-5 g-4">
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/html/sass.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>SASS</h5>
                                                <p class="f-light">
                                                    The superset CSS makes it simple to develop and usefulness
                                                    with variables, selectors, and nesting.
                                                </p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/16.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Svelte 3 v</h5>
                                                <p class="f-light">
                                                    It's now possible to write components with significantly less
                                                    boilerplate than you'll find elsewhere.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/svelte/1.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Sveltestrap</h5>
                                                <p class="f-light">
                                                    Sveltestrap provides all Bootstrap 4 & 5 components for a Svelte
                                                    app,without needing to use Bootstrap component classes.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/16.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Svelte-navigator</h5>
                                                <p class="f-light">
                                                    Svelte Navigator is an accessible and relatively lightweight Single
                                                    Page App router inspired by react-router and @reach/router.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/svelte/4.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Svelte-i18n</h5>
                                                <p class="f-light">
                                                    Svelte-i18n helps you localize your app using the reactive tools
                                                    Svelte provides. by using stores to keep track of the current
                                                    locale, dictionary of messages.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/stroke-icon/16.png"
                                                    alt=""></div>
                                            <div class="frame-details">
                                                <h5>Svelte-link</h5>
                                                <p class="f-light">
                                                    Anchor link component for Svelte. Latest version: 1.4.0. Start using
                                                    svelte-link in your project by running.</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-xxl-4 col-md-6">
                                        <div class="framework-box">
                                            <div class="frame-icon"> <img
                                                    src="../assets/images/landing/icon/svelte/3.png" alt="">
                                            </div>
                                            <div class="frame-details">
                                                <h5>Svelte-simple-datatables</h5>
                                                <p class="f-light">
                                                    Is a responsive svelte datatable component that fits its container
                                                    and scrolls vertically & horizontally.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space components-section cuba-demo-section pt-0" id="components">
            <div class="container">
                <ul class="decoration">
                    <li class="flower-gif">
                        <div class="mesh-loader">
                            <div class="set-one">
                                <div class="circle"></div>
                                <div class="circle"></div>
                            </div>
                            <div class="set-two">
                                <div class="circle"></div>
                                <div class="circle"></div>
                            </div>
                        </div>
                    </li>
                </ul>
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="cuba-demo-content">
                            <div class="couting">
                                <h2>90+</h2>
                            </div>
                            <div class="landing-title">
                                <h5 class="sub-title">Usable Components</h5>
                                <h2><span class="gradient-8">UI components </span> is first class</h2>
                                <p>
                                    The UI components will facilitate you in developing the most user-friendly,
                                    interactive websites and applications with cutting-edge design features.
                                </p>
                            </div>
                        </div>
                        <div class="vector-image"> <img src="../assets/images/landing/vectors/3.svg"
                                alt="vector women"></div>
                    </div>
                </div>
            </div>
            <div class="container-fluid overflow-hidden">
                <div class="row component_responsive g-3 mb-3" data-jarallax-element="0 100">
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/1.svg"
                                alt="">
                            <h6 class="m-0 Pt-4">SweetAlert2</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/2.svg"
                                alt="">
                            <h6 class="m-0">Avatar</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/3.svg"
                                alt="">
                            <h6 class="m-0">Scrollable</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/4.svg"
                                alt="">
                            <h6 class="m-0">Tree view</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/5.svg"
                                alt="">
                            <h6 class="m-0">Bootstrap notify</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/6.svg"
                                alt="">
                            <h6 class="m-0">Rating </h6>
                        </div>
                    </div>
                </div>
                <div class="row component_responsive g-3 mb-3" data-jarallax-element="0 -150">
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/7.svg"
                                alt="">
                            <h6 class="m-0">Dropzone</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/8.svg"
                                alt="">
                            <h6 class="m-0">Tour</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/9.svg"
                                alt="">
                            <h6 class="m-0">Animated modal</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/10.svg"
                                alt="">
                            <h6 class="m-0">Owl Carousel</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/11.svg"
                                alt="">
                            <h6 class="m-0">Ribbons </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/12.svg"
                                alt="">
                            <h6 class="m-0">Pagination </h6>
                        </div>
                    </div>
                </div>
                <div class="row component_responsive g-3 mb-3" data-jarallax-element="0 100">
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/13.svg"
                                alt="">
                            <h6 class="m-0">Steps </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/14.svg"
                                alt="">
                            <h6 class="m-0">Breadcrumb </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/15.svg"
                                alt="">
                            <h6 class="m-0">Range Slider </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/16.svg"
                                alt="">
                            <h6 class="m-0">image cropper </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/17.svg"
                                alt="">
                            <h6 class="m-0">Sticky </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/18.svg"
                                alt="">
                            <h6 class="m-0">Progress </h6>
                        </div>
                    </div>
                </div>
                <div class="row component_responsive g-3 mb-3" data-jarallax-element="0 -150">
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/19.svg"
                                alt="">
                            <h6 class="m-0">Tooltip </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/20.svg"
                                alt="">
                            <h6 class="m-0">Spinners </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/21.svg"
                                alt="">
                            <h6 class="m-0">Dropdown </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/22.svg"
                                alt="">
                            <h6 class="m-0">Tabs </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/23.svg"
                                alt="">
                            <h6 class="m-0">Accordion </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/24.svg"
                                alt="">
                            <h6 class="m-0">Navs</h6>
                        </div>
                    </div>
                </div>
                <div class="row component_responsive g-3" data-jarallax-element="0 100">
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/25.svg"
                                alt="">
                            <h6 class="m-0">Shadow</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/26.svg"
                                alt="">
                            <h6 class="m-0">state color</h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/27.svg"
                                alt="">
                            <h6 class="m-0">List </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/28.svg"
                                alt="">
                            <h6 class="m-0">Grid </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/29.svg"
                                alt="">
                            <h6 class="m-0">Helper classes </h6>
                        </div>
                    </div>
                    <div class="col-xxl-2 col-lg-3 col-md-4 col-6 component-col-set">
                        <div class="component-hover-effect"><img src="../assets/images/landing/icon/30.svg"
                                alt="">
                            <h6 class="m-0">Typography</h6>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space cuba-demo-section bg-Widget pt-0">
            <div class="container">
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title">
                            <h5 class="sub-title">Our cards</h5>
                            <h2>Introducing Our <span class="gradient-9">Cards collections</span></h2>
                            <p>
                                Utilise the adaptable and practical templates to make your web application
                                outstanding and more creative that provides you a competitive advantage.
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="container-fluid o-hidden">
                <div class="row landing-cards">
                    <div class="col-lg-12">
                        <div class="animate-slider">
                            <div class="cards-image"> <img src="../assets/images/landing/cards.png"
                                    alt=""></div>
                            <div class="cards-image"> <img src="../assets/images/landing/cards.png"
                                    alt=""></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space pt-0" id="landings">
            <div class="container-fluid fluid-space">
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title">
                            <h5 class="sub-title">Treading & Clean Landing Page Collection</h5>
                            <h2>Introducing Our <span class="gradient-1">New Landings</span></h2>
                            <p>Gain a competitive edge by creating a creatively designed landing page with versatile
                                templates.</p>
                        </div>
                    </div>
                </div>
                <div class="row g-4 row-cols-xl-4 row-cols-sm-2 row-cols-1">
                    <div class="col">
                        <div class="app-box app-bg-1">
                            <h6><span class="app-title">SASS Landing</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect image-height"><a
                                        href="https://admin.pixelstrap.com/cuba/landing/html/" target="_blank"><img
                                            class="img-fluid cuba-img" src="../assets/images/landing/landings/1.jpg"
                                            alt="nft page"></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col">
                        <div class="app-box app-bg-2">
                            <h6><span class="app-title">App Landing</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect image-height"><a
                                        href="https://admin.pixelstrap.com/cuba/landing/html/index-2.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/landings/2.jpg" alt="nft page"></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col">
                        <div class="app-box app-bg-4">
                            <h6><span class="app-title">Job Landing</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect image-height"><a
                                        href="https://admin.pixelstrap.com/cuba/landing/html/index-3.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/landings/3.jpg" alt="nft page"></a></div>
                            </div>
                        </div>
                    </div>
                    <div class="col">
                        <div class="app-box app-bg-6 h-100">
                            <h6><span class="app-title">NFT Landing</span><span class="line"></span></h6>
                            <div class="app-image">
                                <ul class="dot-group">
                                    <li></li>
                                    <li></li>
                                    <li></li>
                                </ul>
                                <div class="img-effect image-height"><a
                                        href="https://admin.pixelstrap.com/cuba/landing/html/index-4.html"
                                        target="_blank"><img class="img-fluid cuba-img"
                                            src="../assets/images/landing/landings/4.jpg" alt="nft page"></a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section-space document-section feature-section pt-0" id="documentation">
            <div class="container">
                <div class="row">
                    <div class="col-sm-12 wow pulse">
                        <div class="landing-title">
                            <h5 class="sub-title">Our Documentation</h5>
                            <h2><span class="gradient-5">Well </span> Documented</h2>
                            <p>Html, Vue, Angular, React, Django, Laravel , Nodejs , Codeigniter , Flask, PHP all this
                                versions documentation available in cuba admin template</p>
                        </div>
                    </div>
                </div>
                <div class="row g-sm-4 g-3">
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/html/document/" target="_blank">
                            <div class="doc-icon bg-icon1"><img
                                    src="../assets/images/landing/icon/django/bootstrap.png" alt="html logo"></div>
                            <h5>Bootstrap 5</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://angular-cuba-doc.vercel.app" target="_blank">
                            <div class="doc-icon bg-icon2"><img
                                    src="{{ asset('assets/images/landing/icon/angular/angular.png') }}" alt="angular logo">
                            </div>
                            <h5>Angular 16</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://vue-cuba-doc-vuepixelstrap.vercel.app/" target="_blank">
                            <div class="doc-icon bg-icon3"><img src="{{ asset('assets/images/landing/icon/vue/vue.png') }}"
                                    alt="vue logo"></div>
                            <h5>Vue 3</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://react-cuba-doc.vercel.app/" target="_blank">
                            <div class="doc-icon bg-icon4"><img src="../assets/images/landing/stroke-icon/4.svg"
                                    alt="react logo"></div>
                            <h5>React</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/laravel/document/" target="_blank">
                            <div class="doc-icon bg-icon5"><img
                                    src="{{ asset('assets/images/landing/icon/laravel/laravel.png') }}" alt="laravel logo">
                            </div>
                            <h5>Laravel 10</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/django/document/" target="_blank">
                            <div class="doc-icon bg-icon6"><img
                                    src="../assets/images/landing/icon/django/django.png" alt="django logo"></div>
                            <h5>Django 4.0.4</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/flask/document/" target="_blank">
                            <div class="doc-icon bg-icon7"><img src="../assets/images/landing/stroke-icon/7.svg"
                                    alt="flask logo"></div>
                            <h5>Flask 2.2.2</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/codeigniter/document/" target="_blank">
                            <div class="doc-icon bg-icon8"><img
                                    src="../assets/images/landing/icon/codeigniter/codeigniter-icon.png"
                                    alt="codeigniter logo"></div>
                            <h5>Codeigniter</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/node/document/" target="_blank">
                            <div class="doc-icon bg-icon9"><img src="../assets/images/landing/stroke-icon/10.svg"
                                    alt="nodejs logo"></div>
                            <h5>Nodejs</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/php/document/" target="_blank">
                            <div class="doc-icon bg-icon10"><img src="../assets/images/landing/stroke-icon/8.svg"
                                    alt="php logo"></div>
                            <h5>PHP</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/symfony/document/" target="_blank">
                            <div class="doc-icon bg-icon11"><img src="../assets/images/landing/stroke-icon/12.svg"
                                    alt="php logo"></div>
                            <h5>Symfony</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/dotnet/document/" target="_blank">
                            <div class="doc-icon bg-icon10"><img src="../assets/images/landing/stroke-icon/13.svg"
                                    alt=".net logo"></div>
                            <h5>.NET</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://cuba-nuxt-doc.vercel.app/getting_started" target="_blank">
                            <div class="doc-icon bg-icon3"><img src="../assets/images/landing/stroke-icon/14.svg"
                                    alt="nuxt logo"></div>
                            <h5>Nuxt</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://next-cuba-doc-pixelstrapthemes.vercel.app/getting_started"
                            target="_blank">
                            <div class="doc-icon bg-icon12"><img src="../assets/images/landing/icon/next/next.png"
                                    alt="next js logo"></div>
                            <h5>Next js</h5>
                        </a></div>
                    <div class="col-xl-3 col-lg-4 col-6"><a class="document-box"
                            href="https://docs.pixelstrap.com/cuba/svelte/document/" target="_blank">
                            <div class="doc-icon bg-icon8"><img src="../assets/images/landing/stroke-icon/16.png"
                                    alt="svelte logo"></div>
                            <h5>Svelte</h5>
                        </a></div>
                </div>
            </div>
        </section>
        <div class="bottom-section-grad">
            <section class="section-space about-section pb-0">
                <div class="container-fluid fluid-space">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="landing-title text-center">
                                <h5 class="sub-title">Best Customer Feedback</h5>
                                <h2>The opinions of our <span class="gradient-10">valuable </span> Customers</h2>
                                <p>we are always be there for your issues and support.if any query you can ask us on our
                                    theme supports</p>
                            </div>
                        </div>
                        <div class="col-sm-12">
                            <div class="testimonial-slider">
                                <div class="testimonial-box common-card">
                                    <div class="rating-content">
                                        <ul class="d-flex ratings gap-1">
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                        </ul>
                                        <h6 class="mb-0">Feature Availability</h6>
                                    </div>
                                    <p class="f-light">Great Template, bought two in less than a week. For this price
                                        it is ridiculous not to purchase it. Beautiful design all across. Prebuilt
                                        integration with firebase auth, light and dark theme.</p>
                                    <p class="f-light">A very very good template.</p>
                                    <div class="text-end mt-2">
                                        <h5>flucadetena</h5><span class="font-primary">CUSTOMER</span>
                                    </div>
                                    <div class="customer-img"><img src="../assets/images/landing/testimonial/1.svg"
                                            alt="vector men"></div>
                                </div>
                                <div class="testimonial-box common-card">
                                    <div class="rating-content">
                                        <ul class="d-flex ratings gap-1">
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                        </ul>
                                        <h6 class="mb-0">Design Quality</h6>
                                    </div>
                                    <p class="f-light">I really love the Design.</p>
                                    <p class="f-light"> I am using the React Option btw.</p>
                                    <p class="f-light"> The Documentation is great and for 5$ you can't do anything
                                        wrong here.Its pretty easy to swap out the default design or implement a dark
                                        mode. I wish there was a tsx version(React Typescript) out of the box. But even
                                        wighout its great to work with.</p>
                                    <div class="text-end mt-2">
                                        <h5>MenschenToaster</h5><span class="font-primary">CUSTOMER</span>
                                    </div>
                                    <div class="customer-img"><img src="../assets/images/landing/testimonial/2.svg"
                                            alt="vector men"></div>
                                </div>
                                <div class="testimonial-box common-card">
                                    <div class="rating-content">
                                        <ul class="d-flex ratings gap-1">
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                        </ul>
                                        <h6 class="mb-0">Code Quality</h6>
                                    </div>
                                    <p class="f-light">Design, code quality, documentation, features, and best part is
                                        easy to integrate in project. This is a great product with great support. I
                                        loved the code quality which reduced my project time.</p>
                                    <div class="text-end mt-2">
                                        <h5>manthandesai999 </h5><span class="font-primary">CUSTOMER</span>
                                    </div>
                                    <div class="customer-img"><img src="../assets/images/landing/testimonial/3.svg"
                                            alt="vector women"></div>
                                </div>
                                <div class="testimonial-box common-card">
                                    <div class="rating-content">
                                        <ul class="d-flex ratings gap-1">
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                        </ul>
                                        <h6 class="mb-0">Code Quality</h6>
                                    </div>
                                    <p class="f-light">This is amazing! Seriously great job right here. Please
                                        increase price because you are simply offering this nearly for free.</p>
                                    <div class="text-end mt-2">
                                        <h5>maidot</h5><span class="font-primary">CUSTOMER</span>
                                    </div>
                                    <div class="customer-img"><img src="../assets/images/landing/testimonial/1.svg"
                                            alt="vector men"></div>
                                </div>
                                <div class="testimonial-box common-card">
                                    <div class="rating-content">
                                        <ul class="d-flex ratings gap-1">
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                            <li><i class="fa fa-star"></i></li>
                                        </ul>
                                        <h6 class="mb-0">Customer Support</h6>
                                    </div>
                                    <p class="f-light">Customer support is excelent. whenever have problem and not
                                        uderstand their support section always helps me. and Admin panel is very nice.
                                        Thanks</p>
                                    <div class="text-end mt-2">
                                        <h5>mahbuburriad</h5><span class="font-primary">CUSTOMER</span>
                                    </div>
                                    <div class="customer-img"><img src="../assets/images/landing/testimonial/2.svg"
                                            alt="vector men"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="faq-section section-space" id="faq">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="landing-title text-center">
                                <h5 class="sub-title">Frequently Ask Question</h5>
                                <h2>Do you have <span class="gradient-11">any Question? </span> Look Here</h2>
                                <p>You can freely reach out to us at any time with any questions! We'd always be happy
                                    to serve you.</p>
                            </div>
                            <div class="vector-image"> <img src="../assets/images/landing/vectors/4.svg"
                                    alt="vector women"></div>
                        </div>
                        <div class="col-sm-12">
                            <div class="accordion" id="faqaccordion">
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="faq1">
                                        <button class="accordion-button" type="button" data-bs-toggle="collapse"
                                            data-bs-target="#faqOne" aria-expanded="true"
                                            aria-controls="faqOne">How can you assist me in achieving the ideal user
                                            behaviour?</button>
                                    </h2>
                                    <div class="accordion-collapse collapse show" id="faqOne"
                                        aria-labelledby="faq1" data-bs-parent="#faqaccordion">
                                        <div class="accordion-body f-light">
                                            Our team will assess the industry and undertake in-depth user
                                            research. We'll design templates and different website
                                            demonstrations, drive engagement, and do A/B tests to determine
                                            whether they are operating at their peak capacity.
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="faq2">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#faqTwo"
                                            aria-expanded="false" aria-controls="faqTwo">How long will the website's
                                            design take?</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="faqTwo" aria-labelledby="faq2"
                                        data-bs-parent="#faqaccordion">
                                        <div class="accordion-body f-light">
                                            Well, it certainly depends on what the clients want, therefore we
                                            really pay close attention to what the "X Factor" is that the
                                            customer or company needs to distinguish itself from the
                                            competition.
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="faq3">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#faqThree"
                                            aria-expanded="false" aria-controls="faqThree">Are there any hidden
                                            fees?</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="faqThree" aria-labelledby="faq3"
                                        data-bs-parent="#faqaccordion">
                                        <div class="accordion-body f-light">
                                            The pricing is the entire sum that you will have to pay. There are
                                            no setup fees, cancellation fees, or other extra or hidden costs.
                                            Everything you need to pay for, including all taxes, is included in
                                            the package.
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="faq4">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#faqFour"
                                            aria-expanded="false" aria-controls="faqFour">What do you mean by item
                                            and end product?</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="faqFour" aria-labelledby="faq4"
                                        data-bs-parent="#faqaccordion">
                                        <div class="accordion-body f-light">The item is what you purchase from Envato
                                            Market. The end product is what you build with that item.</div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header" id="faq5">
                                        <button class="accordion-button collapsed" type="button"
                                            data-bs-toggle="collapse" data-bs-target="#faqFive"
                                            aria-expanded="false" aria-controls="faqFive">Can I use an item as an
                                            element of my logo or branding?</button>
                                    </h2>
                                    <div class="accordion-collapse collapse" id="faqFive" aria-labelledby="faq5"
                                        data-bs-parent="#faqaccordion">
                                        <div class="accordion-body f-light">Only items from the logo category on
                                            GraphicRiver are intended to be used as logos. Other items can't be used in
                                            logos or branding. None of our items, not even logos, can be trademarked.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <section class="pricing-section section-space pt-0">
                <ul class="decoration">
                    <li class="loader-line-gif"><img src="../assets/images/landing/gifs/6.gif" alt="">
                    </li>
                    <li class="loader-gif"><span class="loader-1"></span></li>
                </ul>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-5">
                            <div class="landing-title text-start">
                                <h5 class="sub-title">Our license</h5>
                                <h2>Take a Look at Our <span class="gradient-12">Engagement Models</span></h2>
                                <p class="mx-0">
                                    We've made it simple for customers to get in touch with us and get their
                                    solutions woven. We definitely make sure to present ourselves in the best light
                                    and provide the most value for the money.
                                </p>
                            </div>
                        </div>
                        <div class="col-lg-7">
                            <div class="row g-3">
                                <div class="col-sm-6">
                                    <div class="pricing-box">
                                        <h4>Regular License</h4>
                                        <p>Use by you in a single product where user <span class="font-primary">are
                                                not charged.</span></p>
                                        <ul class="license-list">
                                            <li> <img src="../assets/images/landing/icon/right.svg"
                                                    alt="Right icon">
                                                <h6 class="f-light">Support for 6 months</h6>
                                            </li>
                                            <li> <img src="../assets/images/landing/icon/right.svg"
                                                    alt="Right icon">
                                                <h6 class="f-light">Free future template updates</h6>
                                            </li>
                                            <li> <img src="../assets/images/landing/icon/wrong.png"
                                                    alt="Wrong icon">
                                                <h6 class="f-light">Use in an end product that's sold</h6>
                                            </li>
                                        </ul>
                                        <div class="purchase-details">
                                            <h2>$24.00</h2><a class="btn btn-primary btn-lg rounded-pill purchase-btn"
                                                href="https://1.envato.market/3GVzd">Purchase now</a>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="pricing-box">
                                        <h4>Extended License</h4>
                                        <p>Use by you in a single product where user <span class="font-primary">are
                                                charged.</span></p>
                                        <ul class="license-list">
                                            <li> <img src="../assets/images/landing/icon/right.svg"
                                                    alt="Right icon">
                                                <h6 class="f-light">Support for 6 months</h6>
                                            </li>
                                            <li> <img src="../assets/images/landing/icon/right.svg"
                                                    alt="Right icon">
                                                <h6 class="f-light">Free future template updates</h6>
                                            </li>
                                            <li> <img src="../assets/images/landing/icon/right.svg"
                                                    alt="Right icon">
                                                <h6 class="f-light">Use in an end product that's sold</h6>
                                            </li>
                                        </ul>
                                        <div class="purchase-details">
                                            <h2>$499.00</h2><a
                                                class="btn btn-primary btn-lg rounded-pill purchase-btn"
                                                href="https://1.envato.market/3GVzd">Purchase now </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>
        <footer class="footer-bg">
            <div class="container">
                <div class="landing-center ptb50">
                    <div class="feature-content">
                        <ul>
                            <li>
                                <h4>Trending Template</h4><img src="../assets/images/landing/feature-img.png"
                                    alt="leaf golden">
                            </li>
                            <li>
                                <h4>Overall Best rated Template</h4><img
                                    src="../assets/images/landing/feature-img.png" alt="leaf golden">
                            </li>
                            <li>
                                <h4>Weekly Best Seller</h4><img src="../assets/images/landing/feature-img.png"
                                    alt="leaf golden">
                            </li>
                        </ul>
                    </div>
                    <div class="landing-title">
                        <h2>Build a <span class="gradient-13">stunning site </span> today</h2>
                        <p>The Cuba Bootstrap Admin Theme Trusted By Many Developers World Wide.If You like Our Template
                            So Please Rate Us.</p>
                    </div>
                    <div class="footer-content">
                        <ul class="license-list">
                            <li> <img src="../assets/images/landing/icon/right.svg" alt="Right icon">
                                <h6>Free future template updates</h6>
                            </li>
                            <li> <img src="../assets/images/landing/icon/right.svg" alt="Right icon">
                                <h6>Premium bundled plugins</h6>
                            </li>
                            <li> <img src="../assets/images/landing/icon/right.svg" alt="Right icon">
                                <h6>Quality checked by Envato</h6>
                            </li>
                        </ul><a class="btn btn-lg btn-primary rounded-pill purchase-btn" target="_blank"
                            href="https://1.envato.market/3GVzd">Buy Now </a>
                    </div>
                </div>
                <div class="sub-footer row g-2">
                    <div class="col-md-6">
                        <h6 class="mb-0">Copyright © 2024 Cuba, All rights reserved.</h6>
                    </div>
                    <div class="col-md-6">
                        <ul>
                            <li>
                                <h6 class="mb-0">Find us on</h6>
                            </li>
                            <li> <a href="https://www.facebook.com/"><i
                                        class="fa-brands fa-square-facebook"></i></a></li>
                            <li><a href="https://twitter.com/login"> <i
                                        class="fa-brands fa-square-x-twitter"></i></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </footer>
    </div>
    <!-- latest jquery-->
    <script src="{{ asset('assets/js/jquery-3.5.1.min.js') }}"></script>
    <!-- Bootstrap js-->
    <script src="{{ asset('assets/js/bootstrap/bootstrap.bundle.min.js') }}"></script>
    <!-- feather icon js-->
    <script src="{{ asset('assets/js/icons/feather-icon/feather.min.js') }}"></script>
    <script src="{{ asset('assets/js/icons/feather-icon/feather-icon.js') }}"></script>
    <!-- Plugins JS start-->
    <script src="{{ asset('assets/js/tooltip-init.js') }}"></script>
    <script src="{{ asset('assets/js/animation/wow/wow.min.js') }}"></script>
    <script src="{{ asset('assets/js/landing_sticky.js') }}"></script>
    <script src="{{ asset('assets/js/landing.js') }}"></script>
    <script src="{{ asset('assets/js/jarallax_libs/libs.min.js') }}"></script>
    <script src="{{ asset('assets/js/slick/slick.min.js') }}"></script>
    <script src="{{ asset('assets/js/slick/slick.js') }}"></script>
    <script src="{{ asset('assets/js/landing-slick.js') }}"></script>
    <!-- Plugins JS Ends-->
</body>

</html>
