- var landing_sticky        = true;
- var wow                   = true;
- var animate               = true;
- var tooltip               = true;
- var landing_font          = true;
- var jarallax_libs         = true;
- var landing_icon          = true;
- var slick                 = true;
- var landing_slider        = true;
doctype html
html(lang='en')
  include ../../components/landing-header
  body.landing-page
    include ../../components/taptop
    // page-wrapper Start
    .page-wrapper.landing-page
      // Page Body Start            
      .landing-home
        .container-fluid
          .sticky-header
            header                        
              nav#sidebar-menu.navbar.navbar-b.navbar-dark.navbar-trans.navbar-expand-xl.fixed-top.nav-padding
                a.navbar-brand.p-0(href='#')
                  img.img-fluid(src='../assets/images/landing/landing_logo.png', alt='')
                button.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
                #navbarDefault.navbar-collapse.justify-content-center.collapse.hidenav(style='')
                  ul.navbar-nav.navbar_nav_modify#scroll-spy
                    li.nav-item
                      a.nav-link(href='#layout') Layouts
                    li.nav-item
                      a.nav-link(href='#frameworks') Frameworks
                    li.nav-item
                      a.nav-link(href='#components') Components
                    li.nav-item
                      a.nav-link(href='#applications') Applications
                    li.nav-item
                      a.nav-link(href='#documentation') Documentation
                    li.nav-item
                      a.nav-link(href='#faq') Faq
                .buy-btn.rounded-pill
                  a.nav-link.js-scroll(href='https://1.envato.market/3GVzd' target="_blank") Buy Now
          .row.justify-content-center
            .col-lg-8.col-sm-10
              .content.text-center
                div
                  h6.content-title
                    img.arrow-decore(src="../assets/images/landing/decore/arrow.svg" alt="")
                    span.sub-title Introducing 
                  h1.wow.fadeIn Scalable Admin template with 
                    span trending 
                    | designs
                  p.mt-3.wow.fadeIn Welcome to Cuba - the leading landing page templates, built with React, Angular, flask & Vue. No jQuery!

                  .btn-grp.mt-4
                    a.wow.pulse(href="index.html" target="_blank" data-bs-placement='top', title='HTML') 
                      img(src="../assets/images/landing/icon/html/html.png" alt="")
                    a.wow.pulse(href="https://angular.pixelstrap.com/cuba/" target="_blank" data-bs-placement='top', title='Angular 13') 
                      img(src="../assets/images/landing/icon/angular/angular.png" alt="")
                    a.wow.pulse(href="https://vue.pixelstrap.com/cuba/dashboard/default" target="_blank" data-bs-placement='top', title='Vue 2.6.10') 
                      img(src="../assets/images/landing/icon/vue/vue.png" alt="")
                    a.wow.pulse(href="https://laravel.pixelstrap.com/cuba/dashboard/index" target="_blank" data-bs-placement='top', title='Laravel 9') 
                      img(src="../assets/images/landing/icon/laravel/laravel.png" alt="")
                    a.wow.pulse(href="https://cubadjango.pixelstrap.com/" target="_blank" data-bs-placement='top', title='Django 4.0.4') 
                      img(src="../assets/images/landing/icon/django/django.png" alt="")
                    a.wow.pulse(href="http://cubaflask.pixelstrap.com/" target="_blank" data-bs-placement='top', title='Flask 2.2.2') 
                      img(src="../assets/images/landing/stroke-icon/7.svg" alt="")
                    a.wow.pulse(href="https://react.pixelstrap.com/cuba-context/" target="_blank" data-bs-placement='top', title='React Context')
                      img(src="../assets/images/landing/icon/react/react.png" alt="")
                    a.wow.pulse(href="javascript:void(0)" data-bs-placement='top', title='Coming soon') 
                      img(src="../assets/images/landing/stroke-icon/8.svg" alt="")
                    a.wow.pulse(href="https://codeigniter.pixelstrap.com/cuba/public/" target="_blank" data-bs-placement='top', title='Codeigniter') 
                      img(src="../assets/images/landing/icon/codeigniter/codeigniter-icon.png" alt="")
                    a.wow.pulse(href="https://cuba-nodejs-pixelstrap.herokuapp.com/" target="_blank" data-bs-placement='top', title='Node') 
                      img(src="../assets/images/landing/stroke-icon/10.svg" alt="")
                    a.wow.pulse(href="javascript:void(0)" data-bs-placement='top', title='Coming soon') 
                      img(src="../assets/images/landing/stroke-icon/12.svg" alt="")
            .col-xl-7.col-lg-8.col-md-10                
              img.screen1(src="../assets/images/landing/screen1.png" class="img-fluid" alt="")
      section.section-space.premium-wrap
        .container 
          ul.decoration
            li.flower-gif
              .mesh-loader
                .set-one
                  .circle
                  .circle
                .set-two
                  .circle
                  .circle
            li.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')
          .row.justify-content-center
            .col-sm-12 
              .landing-title
                h5.sub-title Faster, Lighter & Dev. Friendly
                h2 
                  span.gradient-1 Benefits 
                  | of cuba
                p 
              .vector-image 
                img(src="../assets/images/landing/vectors/1.svg", alt="")
            .col-xxl-8
              .row.g-lg-5.g-3
                .col-md-3.col-6
                  .benefit-box.pink
                    svg
                      use(href='../assets/svg/landing-icons.svg#tag')
                    h2.mb-0 4,075
                    h6.mb-0 Sales
                .col-md-3.col-6
                  .benefit-box.purple
                    svg
                      use(href='../assets/svg/landing-icons.svg#ratings')
                    h2.mb-0 4,075
                    h6.mb-0 5 Stars Ratings
                .col-md-3.col-6
                  .benefit-box.red
                    svg
                      use(href='../assets/svg/landing-icons.svg#user_circle')
                    h2.mb-0 3K
                    h6.mb-0 End Users
                .col-md-3.col-6
                  .benefit-box.warning
                    svg
                      use(href='../assets/svg/landing-icons.svg#gear')
                    h2.mb-0 6 Years
                    h6.mb-0 Development
          
      section#layout.section-space.cuba-demo-section.layout.pt-0
        .container
          ul.decoration
            li.line-gif
              img(src="../assets/images/landing/gifs/3.gif", alt="")
            li.wavy-line-gif
              img(src="../assets/images/landing/gifs/4.gif", alt="")
          .row
            .col-sm-12.wow.pulse
              .cuba-demo-content
                .couting
                  h2 12
                .landing-title
                  h5.sub-title Trending & Clean Design Collection
                  h2 
                    span.gradient-2 Creative & unique 
                    | Admin layouts
                  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
        .container-fluid.fluid-space
          .row.demo-imgs.g-xl-5.g-sm-3
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 1 - 
                    | Dubai
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/dubai.jpg" alt="default")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.default-view(href="index.html" data-attr="default" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Dubai" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Dubai" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/compact-sidebar" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 2 - 
                    | Paris
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/paris.jpg" alt="classicSidebar")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.paris-view(href="dashboard-03.html" target='_blank' data-attr="dark-sidebar")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Paris" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Paris" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title="Laravel 9")
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/dark-sidebar" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 3 - 
                    | Los Angeles
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/los-angle.png" alt="material")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.los-view(href="dashboard-02.html" target='_blank' data-attr="material-layout") 
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=LosAngeles" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=LosAngeles" target='_blank') 
                     img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title="Laravel 9")
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/material-layout" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 4 - 
                    | Tokyo
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/tokyo.jpg" alt="compact")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.tokyo-view(href="index.html" target='_blank' data-attr="compact-wrap")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Tokyo" target='_blank') 
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Tokyo" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title="Laravel 9")
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/compact-wrap" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 5 - 
                    | Moscow
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/moscow.jpg" alt="collapse")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.moscow-view(href="dashboard-05.html" target='_blank' data-attr="compact-small")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Moscow" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Moscow" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/compact-small" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 6 - 
                    | Singapore
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/singapore.jpg" alt="enterprise")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.singapore-view(href="index.html" target='_blank' data-attr="enterprice-type")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Singapore" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Singapore" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/enterprice-type" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 7 - 
                    | New York
                  svg.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')
                .overflow-hidden  
                  img.img-fluid(src="../assets/images/landing/layout-images/newyork.png" alt="centralize")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.newyork-view(href="index.html" target='_blank' data-attr="box-layout")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=NewYork" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=NewYork" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/box-layout" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 8 - 
                    | Barcelona
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/singapore.jpg" alt="further")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.barcelona-view(href="index.html" target='_blank' data-attr="advance-type")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Barcelona" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Barcelona" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/advance-type" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 9 - 
                    | Madrid
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/paris.jpg" alt="revolutionary")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.madrid-view(href="dashboard-03.html" target='_blank' data-attr="color-sidebar")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Madrid" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Madrid" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/color-sidebar" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 10 - 
                    | Rome
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/rome.jpg" alt="statistics")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.rome-view(href="dashboard-05.html" target='_blank' data-attr="material-icon")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Rome" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Rome" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/material-icon" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 11 - 
                    | Seoul
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/dubai.jpg" alt="trendy")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.seoul-view(href="index.html" target='_blank' data-attr="modern-layout")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=Seoul" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=Seoul" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/modern-layout" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
            .col-xl-4.col-md-6.demo-content
              .cuba-demo-img
                ul.dot-group 
                  li
                  li
                  li
                .title-wrapper
                  h3.theme-name.mb-0 
                    span Demo 12 - 
                    | London
                  svg.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')
                .overflow-hidden
                  img.img-fluid(src="../assets/images/landing/layout-images/landon.png" alt="blank")
                .hover-link
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='HTML with bootstrap 5')
                    a.html.landon-view(href="index.html" target='_blank' data-attr="default-body")
                      img(src="../assets/images/landing/stroke-icon/1.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Vue 2.6.10')
                    a(href="https://vue.pixelstrap.com/cuba/dashboard/default?layout=London" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/3.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Angular 13')
                    a(href="https://angular.pixelstrap.com/cuba/dashboard/default?layout=London" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/2.svg", alt="")
                  .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="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/7.svg", alt="")
                  .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="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/8.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Laravel 9')
                    a(href="https://laravel.pixelstrap.com/cuba/layouts/default-body" target='_blank')
                      img(src="../assets/images/landing/stroke-icon/5.svg", alt="")
                  .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.img-fluid(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Codeigniter')
                    a(href="https://codeigniter.pixelstrap.com/cuba/public/" target='_blank')
                      img.img-fluid(src="../assets/images/landing/stroke-icon/9.svg", alt="")
                  .link-btn(data-bs-toggle='tooltip', data-bs-placement='top', title='Coming soon')
                    a(href="javascript:void(0)")
                      img.img-fluid(src="../assets/images/landing/stroke-icon/12.svg", alt="")
      section.section-space.customer-support 
        .container 
          ul.decoration.d-sm-block.d-none
            li.round-gif
              img(src="../assets/images/landing/gifs/5.gif", alt="")
          .row.justify-content-center 
            .col-sm-12 
              .landing-title.text-center
                .rating-title.gap-2
                  img.decore-1(src="../assets/images/landing/decore/arrow-3.svg", alt="")
                  ul.d-flex.ratings.gap-1
                    li 
                      i.fa.fa-star
                    li 
                      i.fa.fa-star
                    li 
                      i.fa.fa-star
                    li 
                      i.fa.fa-star
                    li 
                      i.fa.fa-star
                  h6.rating-title.mb-0 4.5 
                    span.f-light (110 rating)
                h2 
                  span.gradient-1 Thousands 
                  | of customers love us
                p The marketer's goal is to help customers feel confident about their choice. Just providing more information often doesn't help
            .col-xxl-10
              .row.customer-wrap
                .col-md-3.col-6
                  .customer-wrapper
                    .customer-box 
                      img(src="../assets/images/landing/customers/1.svg", alt="")
                      h6.f-light.mb-0.mt-2 Top rated template
                    img.outline-box(src="../assets/images/landing/decore/arrow-style-1.svg", alt="")
                .col-md-3.col-6
                  .customer-wrapper
                    .customer-box 
                      img(src="../assets/images/landing/customers/2.svg", alt="")
                      h6.f-light.mb-0.mt-2 Highest selling template
                    img.outline-box(src="../assets/images/landing/decore/arrow-style-2.svg", alt="")
                .col-md-3.col-6
                  .customer-wrapper
                    .customer-box 
                      img(src="../assets/images/landing/customers/3.svg", alt="")
                      h6.f-light.mb-0.mt-2 Super easy to deploy
                    img.outline-box(src="../assets/images/landing/decore/arrow-style-3.svg", alt="")
                .col-md-3.col-6
                  .customer-wrapper
                    .customer-box 
                      img(src="../assets/images/landing/customers/4.svg", alt="")
                      h6.f-light.mb-0.mt-2 Fast Customer Support
                    img.outline-box(src="../assets/images/landing/decore/arrow-style-4.svg", alt="")
      section.customization-wrap 
        .container 
          .row 
            .col-lg-6 
              .landing-title.text-start
                h5.sub-title Theme Customization
                h2 
                  span.gradient-3 Real-time 
                  | customization & preview
                p.m-0 The live customizer offers everything you need to customize.there is no coding required.
              .customization-accordion 
                #accordionExample.accordion
                  .accordion-item
                    h2#headingOne.accordion-header
                      button.accordion-button.collapsed(type='button' data-bs-toggle='collapse' data-bs-target='#collapseOne' aria-expanded='false' aria-controls='collapseOne')
                        | Sidebar Builder
                    #collapseOne.accordion-collapse.collapse(aria-labelledby='headingOne' data-bs-parent='#accordionExample')
                      .accordion-body.f-light
                    
                  .accordion-item
                    h2#headingTwo.accordion-header
                      button.accordion-button(type='button' data-bs-toggle='collapse' data-bs-target='#collapseTwo' aria-expanded='true' aria-controls='collapseTwo')
                        | Unlimited color
                    #collapseTwo.accordion-collapse.collapse.show(aria-labelledby='headingTwo' data-bs-parent='#accordionExample')
                      .accordion-body.f-light
                        | Change primary and secondary theme colors using this customization option.we are providing this settings for primary and secondary colors
                  .accordion-item
                    h2#headingThree.accordion-header
                      button.accordion-button.collapsed(type='button' data-bs-toggle='collapse' data-bs-target='#collapseThree' aria-expanded='false' aria-controls='collapseThree')
                        | Layout type
                    #collapseThree.accordion-collapse.collapse(aria-labelledby='headingThree' data-bs-parent='#accordionExample')
                      .accordion-body.f-light 
                      
            .col-lg-6 
              .customization-img 
                img.img-fluid(src="../assets/images/landing/customiztion.svg", alt="")
      section#applications.section-space.app-section
        .container-fluid.fluid-space
          ul.decoration
            li.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')
          .row
            .col-sm-12.wow.pulse
              .landing-title
                h5.sub-title Trending & Clean Design Collection
                h2 
                  | Fast & powerful 
                  span.gradient-4 Applications
                
          .row.g-4
            .col-xl-4.col-md-6 
              .app-box.app-bg-1 
                h6
                  span.app-title Social App
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/social-app.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/social-app.jpg' alt='')
            .col-xl-4.col-md-6 
              .app-box.app-bg-2 
                h6
                  span.app-title knowledgebase
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/knowledgebase.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/knowlagebase-app.jpg' alt='')
            .col-xl-4.col-md-6 
              .app-box.app-bg-3 
                h6
                  span.app-title kanban
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/kanban.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/apps/kanban.jpg' alt='')
            .col-xl-4.col-md-6 
              .app-box.app-bg-4 
                h6
                  span.app-title Ecommerce
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/product-page.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/ecommerce-app.jpg' alt='')
            .col-xl-4.col-md-6 
              .app-box.app-bg-5.h-100
                h6
                  span.app-title Chat
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/chat.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/apps/chat.jpg' alt='')
            .col-xl-4.col-md-6 
              .app-box.app-bg-6.h-100
                h6
                  span.app-title File manager
                  span.line
                .app-image
                  ul.dot-group
                    li
                    li
                    li
                  .img-effect
                    a(href='../theme/file-manager.html' target='_blank')
                      img.img-fluid.cuba-img(src='../assets/images/landing/apps/file.jpg' alt='')
        marquee.text-marqee(direction='left') 
            h2.big-title Faster, Lighter & Friendly 
                       
      section.section-space.feature-section.pt-0 
        ul.decoration
          li.round-gif
            img(src="../assets/images/landing/gifs/5.gif", alt="")
        .container
          .row 
            .col-sm-12.wow.pulse
              .landing-title
                h5.sub-title Why you choose Cuba
                h2 
                  | Introducing our 
                  span.gradient-5 Core Features
                p 
              .vector-image 
                img(src="../assets/images/landing/vectors/2.svg", alt="vector women")
          .row.g-4 
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-1
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/1.svg", alt="")
                h5 Quality & Clean Code
                p.mb-0.f-light All you need to know of using clean code as a manager to make your team and your software awesome. 
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-2
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/2.svg", alt="")
                h5 Bootstrap v5.0
                p.mb-0.f-light Bootstrap is a complete CSS framework.Bootstrap is built on responsive 12-column grids, layouts, and components
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-3
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/3.svg", alt="")
                h5 Handmade Icons
                p.mb-0.f-light 
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-4
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/4.svg", alt="")
                h5 Limitless Components
                p.mb-0.f-light The limitless layout collection and UI kit library is the biggest collection of layouts for web design
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-5
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/5.svg", alt="")
                h5 Easy Customizable
                p.mb-0.f-light Easy Step-By-Step Guide for Beginners.customize your layout, settings and content
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-6
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/6.svg", alt="")
                h5 Responsive & User-Friendly
                p.mb-0.f-light Use Responsive Design to Connect with all Device Users 
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-7
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/7.svg", alt="")
                h5 Premium Support
                p.mb-0.f-light We are always be their for your support and you are facing some issues you can create ticket.
            .col-xxl-3.col-lg-4.col-sm-6 
              .feature-box.common-card.bg-feature-8
                .feature-icon 
                  img(src="../assets/images/landing/feature-icon/8.svg", alt="")
                h5 Colors Options
                p.mb-0.f-light Cuba provide unlimited main color option.other colors you can change easily using scss variables
      section.build-section 
        .container
          ul.decoration
            li.loader-gif
              span.loader-1 
          .row 
            .col-sm-12.wow.pulse 
              .landing-title.text-start
                h2 Build stunning and powerful landing page with 
                  span.gradient-6 customizable and easy 
                  | to understand.
                img.title-img.d-sm-block.d-none(src="../assets/images/landing/decore/arrow-4.svg", alt="")
                h4.d-sm-block.d-none.sub-title.rotate-title.mb-0 The Biggest template Collection Ever Build.
          .row.g-4 
            .col-md-6 
              .build-image 
                img(src="../assets/images/landing/sale.png", alt="")
            .col-md-6 
              .build-content.text-end 
                p.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.
      section.section-space.framework-section#frameworks
        .container
          ul.decoration
            li.loader-line-gif
              img(src="../assets/images/landing/gifs/6.gif", alt="")
            li.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')
          .row 
            .col-sm-12 
              .landing-title
                h5.sub-title 10+ frameworks available
                h2 Latest Updates in 
                  span.gradient-7 All Frameworks
                p Html, Vue, Angular, React, Django, Laravel , Nodejs , Codeigniter , Flask, PHP all this versions available in 
            .col-sm-12 
              ul#myTab.nav.nav-tabs.frame-tab(role='tablist')
                li.nav-item(role='presentation')
                  button#html-tab.nav-link.active(data-bs-toggle='tab' data-bs-target='#html' type='button' role='tab' aria-controls='html' aria-selected='true')
                    img(src='../assets/images/landing/icon/html/html.png' alt='')
                    span HTML
                li.nav-item(role='presentation')
                  button#react-tab.nav-link(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
                li.nav-item(role='presentation')
                  button#angular-tab.nav-link(data-bs-toggle='tab' data-bs-target='#angular' type='button' role='tab' aria-controls='angular' aria-selected='false')
                    img(src='../assets/images/landing/icon/angular/angular.png' alt='')
                    span Angular
                li.nav-item(role='presentation')
                  button#vue-tab.nav-link(data-bs-toggle='tab' data-bs-target='#vue' type='button' role='tab' aria-controls='vue' aria-selected='false')
                    img(src='../assets/images/landing/icon/vue/vue.png' alt='')
                    span Vuejs
                li.nav-item(role='presentation')
                  button#laravel-tab.nav-link(data-bs-toggle='tab' data-bs-target='#laravel' type='button' role='tab' aria-controls='laravel' aria-selected='false')
                    img(src='../assets/images/landing/icon/laravel/laravel.png' alt='')
                    span Laravel
                li.nav-item(role='presentation')
                  button#django-tab.nav-link(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
                li.nav-item(role='presentation')
                  button#flask-tab.nav-link(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
                li.nav-item(role='presentation')
                  button#nodejs-tab.nav-link(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
                li.nav-item(role='presentation')
                  button#symfony-tab.nav-link(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
                li.nav-item(role='presentation')
                  button#php-tab.nav-link(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
              #myTabContent.tab-content
                #html.tab-pane.fade.show.active(role='tabpanel' aria-labelledby='html-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/sass.png", alt="")
                        .frame-details
                          h5 SCSS
                          p.f-light The superset CSS makes it simple to develop and 
                            | usefulness 
                            | with variables, selectors, and nesting.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5
                          p.f-light It is designed to generate responsive front-end web development 
                            | that is mobile-friendly.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/pug.png", alt="")
                        .frame-details
                          h5 PUG
                          p.f-light Pug.js enables generating dynamic data and developing adaptable 
                            | HTML code.The overall productivity increases.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/npm.png", alt="")
                        .frame-details
                          h5 NPM
                          p.f-light Node.js source code or a pre-built installer for your platform, and start developing today
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/gulp.png", alt="")
                        .frame-details
                          h5 Gulp
                          p.f-light It is a very useful tool that makes code compilation simple, especially when creating back-end programmes.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/forms.png", alt="")
                        .frame-details
                          h5 Form
                          p.f-light To facilitate 
                            | form access and modification, the fields and field labels are 
                            | logically arranged.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/6.png", alt="")
                        .frame-details
                          h5 Apex chart
                          p.f-light It also has its own special 
                            | characteristics that will make the data genuinely interactive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/7.png", alt="")
                        .frame-details
                          h5 Chart.js
                          p.f-light It makes data visualisation simple. It offers 8 different chart kinds, 
                            | all of which are responsive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/8.png", alt="")
                        .frame-details
                          h5 Chartist
                          p.f-light Chartist gives designers and developers the chance to 
                            | make charts that are cross-browser compatible.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/apps.png", alt="")
                        .frame-details
                          h5 Apps
                          p.f-light Assist you in building the most user-friendly, dynamic websites 
                            | and applications with cutting-edge designs
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/10.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You also have the option to enable animated thumbnails from the settings. Zoom & Fullscreen.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/iconset.png", alt="")
                        .frame-details
                          h5 Icons
                          p.f-light We have provide 4 & 5 types of different icons.most trending icons like font awesome, feather icons.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/layout.png", alt="")
                        .frame-details
                          h5 Layout
                          p.f-light Those that seamlessly adjust to different screen sizes and responsive layouts for your business.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/uikits.png", alt="")
                        .frame-details
                          h5 Ui kits
                          p.f-light We are provide bunch of ui kits for create easy design and reusable components
                #react.tab-pane.fade(role='tabpanel' aria-labelledby='react-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/hook.png", alt="")
                        .frame-details
                          h5 React Hook
                          p.f-light A component has many different phases of its life, react hook helps us to run some functionality at a particular phase.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/reactstrap.png", alt="")
                        .frame-details
                          h5 React Strap
                          p.f-light Designing will pure css is a hassle, React Strap reduces this inconvenience and speeds up the designing process.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/noquery.png", alt="")
                        .frame-details
                          h5 No Jquery
                          p.f-light JQuery interferes with javascript of react sometimes.we made sure that it does'nt do that.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/redux.png", alt="")
                        .frame-details
                          h5 Redux
                          p.f-light Used for state management. Helps with defining global variables and manipulating them.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/firebase.png", alt="")
                        .frame-details
                          h5 Firebase Auth
                          p.f-light Online database of Firebase has been used for authentication, making authentication reliable and more secure.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/crud.png", alt="")
                        .frame-details
                          h5 Firebase crud
                          p.f-light Crud has been explained using a simple to-do application and has been integrated with firebase/firestore.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/chat.png", alt="")
                        .frame-details
                          h5 Chat
                          p.f-light A Design of a chat application has been given, so that you can create your own chat app in your theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/animation.png", alt="")
                        .frame-details
                          h5 Router Animation
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/props_state.png", alt="")
                        .frame-details
                          h5 State and props
                          p.f-light To manage state between multiple components props and state management tools has been used with good code structure.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/reactrouter.png", alt="")
                        .frame-details
                          h5 React-Router
                          p.f-light Through react-router, by attaching different components to different navigation routes.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/chart.png", alt="")
                        .frame-details
                          h5 Amazing Chart
                          p.f-light Data visualization seems boring without them. To provide more visually pleasing way to present data.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/map.png", alt="")
                        .frame-details
                          h5 Map
                          p.f-light Frankly we would be lost without them. But no worries, many of them are given in our theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/gallery.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You have many pictures , we have ways to display them. With multiple gallery options, managing pictures is now easy.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/application.png", alt="")
                        .frame-details
                          h5 Application
                          p.f-light It doesn't end here, explore the theme and discovery many amazing applications inside it.
                #angular.tab-pane.fade(role='tabpanel' aria-labelledby='angular-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/sass.png", alt="")
                        .frame-details
                          h5 SCSS
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/2.png", alt="")
                        .frame-details
                          h5 Ng bootstrap
                          p.f-light Allowing us to write pre-made classes to style our theme and also add some functionalities as well.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/4.png", alt="")
                        .frame-details
                          h5 Router
                          p.f-light Router attaches components to some paths, through this paths , components can now be viewed.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/5.png", alt="")
                        .frame-details
                          h5 Form
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/6.png", alt="")
                        .frame-details
                          h5 Apex Chart
                          p.f-light To visualize data in more attractive manner, we have provided Apex charts. Many different chart options are available in apex chart.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/7.png", alt="")
                        .frame-details
                          h5 Chart.js
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/8.png", alt="")
                        .frame-details
                          h5 Chartist
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/9.png", alt="")
                        .frame-details
                          h5 Google maps
                          p.f-light Frankly we would be lost without them. But no worries, many of them are given in our theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/10.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You have many pictures , we have ways to display them. With multiple gallery options, managing pictures is now easy.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/11.png", alt="")
                        .frame-details
                          h5 Ecommerce
                          p.f-light Ecommerce is just one of theme. Explore our theme and you will find multiple uses for it.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/12.png", alt="")
                        .frame-details
                          h5 Firebase Auth
                          p.f-light Online database of Firebase has been used for authentication, making authentication reliable and more secure.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/13.png", alt="")
                        .frame-details
                          h5 Firebase crud
                          p.f-light Crud has been explained using a simple to-do application and has been integrated with firebase/firestore.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/14.png", alt="")
                        .frame-details
                          h5 Chat
                          p.f-light A Design of a chat application has been given, so that you can create your own chat app in your theme.
                #vue.tab-pane.fade(role='tabpanel' aria-labelledby='vue-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/firebase.png", alt="")
                        .frame-details
                          h5 Firebase
                          p.f-light An online database , easier to use, easier to maintain, with multiple different uses. We have used it for an example of CRUD.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/nojquery.png", alt="")
                        .frame-details
                          h5 No Jquery
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vuebootstrap.png", alt="")
                        .frame-details
                          h5 Vue Boostrap
                          p.f-light Allowing us to write pre-made classes to style our theme and also add some functionalities as well.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vuex.png", alt="")
                        .frame-details
                          h5 Vuex
                          p.f-light Used for state management.Allowing us to access variables stored in vuex anywhere.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/chart.png", alt="")
                        .frame-details
                          h5 Charts
                          p.f-light A Design of a chat application has been given, so that you can create your own chat app in your theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vueswiper.png", alt="")
                        .frame-details
                          h5 Vue Swiper
                          p.f-light Used for making the site more interactive. more efficiently to display data more less space and in a more visually pleasing way.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vuerouter.png", alt="")
                        .frame-details
                          h5 Vue Router
                          p.f-light Vue Router attaches components to some paths, through this paths , components can now be viewed.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vuemasonary.png", alt="")
                        .frame-details
                          h5 Vue Masonry
                          p.f-light Implementing vue Masonry in our gallery application we have made it more attractive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/vuecli.png", alt="")
                        .frame-details
                          h5 Vue cli
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/animation.png", alt="")
                        .frame-details
                          h5 Animation
                          p.f-light Just imagine a simple static file without anything moving.Pretty boring right.we have included a few different animations in it.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/rangeslider.png", alt="")
                        .frame-details
                          h5 Range Slider
                          p.f-light To make use user has good experience even when increasing or decreasing values, we have included many little features like range slider.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/rtlsupport.png", alt="")
                        .frame-details
                          h5 RTL Support
                          p.f-light The language is written from right to left or left to right, we have included rtl functionality.
                #laravel.tab-pane.fade(role='tabpanel' aria-labelledby='laravel-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/laravel/laravel.png", alt="")
                        .frame-details
                          h5 Laravel 9
                          p.f-light Laravel has been one of the most prevalent PHP frameworks for a long time now
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5
                          p.f-light It is designed to generate responsive front-end web development 
                            | that is mobile-friendly.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/laravel/blade.png", alt="")
                        .frame-details
                          h5 Blade View
                          p.f-light Blade is the simple, yet powerful templating engine that is included with Laravel.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/forms.png", alt="")
                        .frame-details
                          h5 Form
                          p.f-light To facilitate 
                            | form access and modification, the fields and field labels are 
                            | logically arranged.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/6.png", alt="")
                        .frame-details
                          h5 Apex chart
                          p.f-light It also has its own special 
                            | characteristics that will make the data genuinely interactive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/7.png", alt="")
                        .frame-details
                          h5 Chart.js
                          p.f-light It makes data visualisation simple. It offers 8 different chart kinds, 
                            | all of which are responsive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/8.png", alt="")
                        .frame-details
                          h5 Chartist
                          p.f-light Chartist gives designers and developers the chance to 
                            | make charts that are cross-browser compatible.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/apps.png", alt="")
                        .frame-details
                          h5 Apps
                          p.f-light Assist you in building the most user-friendly, dynamic websites 
                            | and applications with cutting-edge designs
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/10.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You also have the option to enable animated thumbnails from the settings. Zoom & Fullscreen.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/iconset.png", alt="")
                        .frame-details
                          h5 Icons
                          p.f-light We have provide 4 & 5 types of different icons.most trending icons like font awesome, feather icons.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/layout.png", alt="")
                        .frame-details
                          h5 Layout
                          p.f-light Those that seamlessly adjust to different screen sizes and responsive layouts for your business.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/uikits.png", alt="")
                        .frame-details
                          h5 Ui kits
                          p.f-light We are provide bunch of ui kits for create easy design and reusable components
                #django.tab-pane.fade(role='tabpanel' aria-labelledby='django-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/django.png", alt="")
                        .frame-details
                          h5 Django 4
                          p.f-light With jinja pre installed with it, reusing code requires no effort.And being python framework it makes you website pretty secure.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5x
                          p.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. 
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/css.png", alt="")
                        .frame-details
                          h5 CSS
                          p.f-light Along with the bootstrap css, It was necessary to use css files to implement some functionalities along with scss files.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/sass.png", alt="")
                        .frame-details
                          h5 sass
                          p.f-light We have used sass. It allows us to use things like variables , inline imports and many other things.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/kit.png", alt="")
                        .frame-details
                          h5 Starter-kit
                          p.f-light We have also included a starter kit so you have some files already ready to use.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/uikits.png", alt="")
                        .frame-details
                          h5 40+ Ui kits
                          p.f-light While creating your custom website you might need small components like range sliders, buttons etc. 
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/layout.png", alt="")
                        .frame-details
                          h5 8+layouts
                          p.f-light Considering multiple uses for our theme, many type of settings have been used to create multiple page layouts.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/builders.png", alt="")
                        .frame-details
                          h5 Builders
                          p.f-light We have given builders like form, page builders where you can drag and drop small elements to create whole page or forms.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/iconset.png", alt="")
                        .frame-details
                          h5 Icon sets
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/forms.png", alt="")
                        .frame-details
                          h5 Forms
                          p.f-light Many forms styles and functionalities related to it has been included in this theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/table.png", alt="")
                        .frame-details
                          h5 Tables
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/apps.png", alt="")
                        .frame-details
                          h5 17+apps
                          p.f-light It doesn't end here, explore the theme and discovery many amazing applications inside it.
                #flask.tab-pane.fade(role='tabpanel' aria-labelledby='flask-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/flask/flask.png", alt="")
                        .frame-details
                          h5 Flask 2.2.2
                          p.f-light With jinja pre installed with it, reusing code requires no effort.And being python framework it makes you website pretty secure.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5x
                          p.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. 
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/css.png", alt="")
                        .frame-details
                          h5 CSS
                          p.f-light It was necessary to use css files to implement some functionalities along with scss files.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/sass.png", alt="")
                        .frame-details
                          h5 SCSS
                          p.f-light we have used sass. It allows us to use things like variables , inline imports and many other things.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/uikits.png", alt="")
                        .frame-details
                          h5 40+ Ui kits
                          p.f-light you might need small components like range sliders, buttons etc. We have provided many different elements.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/kit.png", alt="")
                        .frame-details
                          h5 Starter-kit
                          p.f-light We have also included a starter kit so you have some files already ready to use.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/layout.png", alt="")
                        .frame-details
                          h5 8+layouts
                          p.f-light Considering multiple uses for our theme, many type of settings have been used to create multiple page layouts.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/builders.png", alt="")
                        .frame-details
                          h5 Builders
                          p.f-light We have given builders like form, page builders where you can drag and drop small elements to create whole page or forms.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/iconset.png", alt="")
                        .frame-details
                          h5 Icon sets
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/forms.png", alt="")
                        .frame-details
                          h5 Forms
                          p.f-light Many forms styles and functionalities related to it has been included in this theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/table.png", alt="")
                        .frame-details
                          h5 Tables
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/django/apps.png", alt="")
                        .frame-details
                          h5 17+apps
                          p.f-light It doesn't end here, explore the theme and discovery many amazing applications inside it.
                #nodejs.tab-pane.fade(role='tabpanel' aria-labelledby='nodejs-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/stroke-icon/10.svg", alt="")
                        .frame-details
                          h5 Node.js
                          p.f-light It is amongst the best javascript runtime compiler, which allows you to run javascript in you system without using any browser.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/node/1.png", alt="")
                        .frame-details
                          h5 Express.js
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/vue/nojquery.png", alt="")
                        .frame-details
                          h5 No Jquery
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/14.png", alt="")
                        .frame-details
                          h5 Chat
                          p.f-light A Design of a chat application has been given, so that you can create your own chat app in your theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/chart.png", alt="")
                        .frame-details
                          h5 Amazing Chart
                          p.f-light Data visualization seems boring without them. To provide more visually pleasing way to present data.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/map.png", alt="")
                        .frame-details
                          h5 Map
                          p.f-light Frankly we would be lost without them. But no worries, many of them are given in our theme.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/gallery.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You have many pictures , we have ways to display them. With multiple gallery options, managing pictures is now easy.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/react/application.png", alt="")
                        .frame-details
                          h5 Application
                          p.f-light It doesn't end here, explore the theme and discovery many amazing applications inside it.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/node/2.png", alt="")
                        .frame-details
                          h5 Ejs template engine
                          p.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.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/node/2.png", alt="")
                        .frame-details
                          h5 Express-ejs-layouts
                          p.f-light We have created layouts to set this default components and just pass the content through it.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/4.png", alt="")
                        .frame-details
                          h5 Router
                          p.f-light Through router, by attaching different components to different navigation routes.
                #symfony.tab-pane.fade(role='tabpanel' aria-labelledby='symfony-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/stroke-icon/12.svg", alt="")
                        .frame-details
                          h5 Symfony
                          p.f-light Symfony has been one of the most prevalent PHP frameworks for a long time now
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5
                          p.f-light It is designed to generate responsive front-end web development 
                            | that is mobile-friendly.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/feature-icon/7.svg", alt="")
                        .frame-details
                          h5 Twig template
                          p.f-light Twig reduces templates to simple, PHP code that has been optimised. When compared to standard PHP code, the overhead was significantly reduced.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/forms.png", alt="")
                        .frame-details
                          h5 Form
                          p.f-light To facilitate 
                            | form access and modification, the fields and field labels are 
                            | logically arranged.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/6.png", alt="")
                        .frame-details
                          h5 Apex chart
                          p.f-light It also has its own special 
                            | characteristics that will make the data genuinely interactive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/7.png", alt="")
                        .frame-details
                          h5 Chart.js
                          p.f-light It makes data visualisation simple. It offers 8 different chart kinds, 
                            | all of which are responsive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/8.png", alt="")
                        .frame-details
                          h5 Chartist
                          p.f-light Chartist gives designers and developers the chance to 
                            | make charts that are cross-browser compatible.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/apps.png", alt="")
                        .frame-details
                          h5 Apps
                          p.f-light Assist you in building the most user-friendly, dynamic websites 
                            | and applications with cutting-edge designs
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/10.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You also have the option to enable animated thumbnails from the settings. Zoom & Fullscreen.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/iconset.png", alt="")
                        .frame-details
                          h5 Icons
                          p.f-light We have provide 4 & 5 types of different icons.most trending icons like font awesome, feather icons.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/layout.png", alt="")
                        .frame-details
                          h5 Layout
                          p.f-light Those that seamlessly adjust to different screen sizes and responsive layouts for your business.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/uikits.png", alt="")
                        .frame-details
                          h5 Ui kits
                          p.f-light We are provide bunch of ui kits for create easy design and reusable components
                #php.tab-pane.fade(role='tabpanel' aria-labelledby='php-tab')
                  .row.g-xxl-5.g-4
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src='../assets/images/landing/stroke-icon/8.svg' alt='')
                        .frame-details
                          h5 PHP
                          p.f-light PHP is a server scripting language, and a powerful tool for making dynamic and interactive Web pages.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/bootstrap.png", alt="")
                        .frame-details
                          h5 Bootstrap 5
                          p.f-light It is designed to generate responsive front-end web development 
                            | that is mobile-friendly.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/forms.png", alt="")
                        .frame-details
                          h5 Form
                          p.f-light To facilitate 
                            | form access and modification, the fields and field labels are 
                            | logically arranged.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/6.png", alt="")
                        .frame-details
                          h5 Apex chart
                          p.f-light It also has its own special 
                            | characteristics that will make the data genuinely interactive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/7.png", alt="")
                        .frame-details
                          h5 Chart.js
                          p.f-light It makes data visualisation simple. It offers 8 different chart kinds, 
                            | all of which are responsive.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/8.png", alt="")
                        .frame-details
                          h5 Chartist
                          p.f-light Chartist gives designers and developers the chance to 
                            | make charts that are cross-browser compatible.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/apps.png", alt="")
                        .frame-details
                          h5 Apps
                          p.f-light Assist you in building the most user-friendly, dynamic websites 
                            | and applications with cutting-edge designs
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/angular/10.png", alt="")
                        .frame-details
                          h5 Gallery
                          p.f-light You also have the option to enable animated thumbnails from the settings. Zoom & Fullscreen.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/iconset.png", alt="")
                        .frame-details
                          h5 Icons
                          p.f-light We have provide 4 & 5 types of different icons.most trending icons like font awesome, feather icons.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/layout.png", alt="")
                        .frame-details
                          h5 Layout
                          p.f-light Those that seamlessly adjust to different screen sizes and responsive layouts for your business.
                    .col-xxl-4.col-md-6 
                      .framework-box
                        .frame-icon 
                          img(src="../assets/images/landing/icon/html/uikits.png", alt="")
                        .frame-details
                          h5 Ui kits
                          p.f-light We are provide bunch of ui kits for create easy design and reusable components
      section#components.section-space.components-section.cuba-demo-section.pt-0
        .container
          ul.decoration
            li.flower-gif
              .mesh-loader
                .set-one
                  .circle
                  .circle
                .set-two
                  .circle
                  .circle
          .row
            .col-sm-12.wow.pulse
              .cuba-demo-content
                .couting
                  h2 90+
                .landing-title
                  h5.sub-title Usable Components
                  h2
                    span.gradient-8 UI components 
                    | is first class
                  p
                    | The UI components will facilitate you in developing the most user-friendly, 
                    | interactive websites and applications with cutting-edge design features.
              .vector-image 
                img(src="../assets/images/landing/vectors/3.svg", alt="vector women")
        .container-fluid
          .row.component_responsive.g-3.mb-3(data-jarallax-element="0 100")
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/1.svg' alt='')
                h6.m-0.Pt-4 SweetAlert2
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/2.svg' alt='')
                h6.m-0 Avatar
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/3.svg' alt='')
                h6.m-0 Scrollable
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/4.svg' alt='')
                h6.m-0 Tree view
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/5.svg' alt='')
                h6.m-0 Bootstrap notify
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/6.svg' alt='')
                h6.m-0 Rating 
          .row.component_responsive.g-3.mb-3(data-jarallax-element="0 -150")
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/7.svg' alt='')
                h6.m-0 Dropzone
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/8.svg' alt='')
                h6.m-0 Tour
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/9.svg' alt='')
                h6.m-0 Animated modal
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/10.svg' alt='')
                h6.m-0 Owl Carousel
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/11.svg' alt='')
                h6.m-0 Ribbons 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/12.svg' alt='')
                h6.m-0 Pagination 
          .row.component_responsive.g-3.mb-3(data-jarallax-element="0 100")
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/13.svg' alt='')
                h6.m-0 Steps 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/14.svg' alt='')
                h6.m-0 Breadcrumb  
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/15.svg' alt='')
                h6.m-0 Range Slider 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/16.svg' alt='')
                h6.m-0 image cropper 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/17.svg' alt='')
                h6.m-0 Sticky 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/18.svg' alt='')
                h6.m-0 Progress 
          .row.component_responsive.g-3.mb-3(data-jarallax-element="0 -150")
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/19.svg' alt='')
                h6.m-0 Tooltip 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/20.svg' alt='')
                h6.m-0 Spinners 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/21.svg' alt='')
                h6.m-0 Dropdown 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/22.svg' alt='')
                h6.m-0 Tabs 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/23.svg' alt='')
                h6.m-0 Accordion  
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/24.svg' alt='')
                h6.m-0 Navs
          .row.component_responsive.g-3(data-jarallax-element="0 100")
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/25.svg' alt='')
                h6.m-0 Shadow
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/26.svg' alt='')
                h6.m-0 state color
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/27.svg' alt='')
                h6.m-0 List  
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/28.svg' alt='')
                h6.m-0 Grid 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/29.svg' alt='')
                h6.m-0 Helper classes 
            .col-xxl-2.col-lg-3.col-md-4.col-6.component-col-set
              .component-hover-effect
                img(src='../assets/images/landing/icon/30.svg' alt='')
                h6.m-0 Typography
      section.section-space.cuba-demo-section.bg-Widget.pt-0
        .container
          .row
            .col-sm-12.wow.pulse
              .landing-title
                h5.sub-title Our cards
                h2
                  | Introducing Our 
                  span.gradient-9 Cards collections
                p
                  | Utilise the adaptable and practical templates to make your web application 
                  | outstanding and more creative that provides you a competitive advantage.
        .container-fluid.o-hidden
          .row.landing-cards
            .col-lg-12
              .animate-slider
                .cards-image 
                  img(src="../assets/images/landing/cards.png", alt="")
                .cards-image 
                  img(src="../assets/images/landing/cards.png", alt="")
      section.section-space.document-section.feature-section.pt-0#documentation
        .container 
          .row 
            .col-sm-12.wow.pulse 
              .landing-title
                h5.sub-title Our Documentation
                h2
                  span.gradient-5 Well 
                  | Documented
                p
                  | Html, 
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/html/document/" target="_blank").document-box
                .doc-icon.bg-icon1
                  img(src="../assets/images/landing/icon/django/bootstrap.png", alt="html logo")
                h5 Bootstrap 5
            .col-xl-3.col-lg-4.col-6
              a(href="https://angular-cuba-doc.vercel.app" target="_blank").document-box
                .doc-icon.bg-icon2
                  img(src="../assets/images/landing/icon/angular/angular.png", alt="angular logo")
                h5 Angular 15
            .col-xl-3.col-lg-4.col-6
              a(href="https://vue-cuba-doc.vercel.app/" target="_blank").document-box
                .doc-icon.bg-icon3
                  img(src="../assets/images/landing/icon/vue/vue.png", alt="vue logo")
                h5 Vue 3
            .col-xl-3.col-lg-4.col-6
              a(href="https://react-cuba-doc.vercel.app/" target="_blank").document-box
                .doc-icon.bg-icon4
                  img(src="../assets/images/landing/stroke-icon/4.svg", alt="react logo")
                h5 React
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/laravel/document/" target="_blank").document-box
                .doc-icon.bg-icon5
                  img(src="../assets/images/landing/icon/laravel/laravel.png", alt="laravel logo")
                h5 Laravel 9
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/django/document/" target="_blank").document-box
                .doc-icon.bg-icon6
                  img(src="../assets/images/landing/icon/django/django.png", alt="django logo")
                h5 Django 4.0.4
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/flask/document/" target="_blank").document-box
                .doc-icon.bg-icon7
                  img(src="../assets/images/landing/stroke-icon/7.svg", alt="flask logo")
                h5 Flask 2.2.2
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/codeigniter/document/" target="_blank").document-box
                .doc-icon.bg-icon8
                  img(src="../assets/images/landing/icon/codeigniter/codeigniter-icon.png", alt="codeigniter logo")
                h5 Codeigniter
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/node/document/" target="_blank").document-box
                .doc-icon.bg-icon9
                  img(src="../assets/images/landing/stroke-icon/10.svg", alt="nodejs logo")
                h5 Nodejs
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/php/document/" target="_blank").document-box
                .doc-icon.bg-icon10
                  img(src="../assets/images/landing/stroke-icon/8.svg", alt="php logo")
                h5 PHP
            .col-xl-3.col-lg-4.col-6
              a(href="https://docs.pixelstrap.com/cuba/symfony/document/" target="_blank").document-box
                .doc-icon.bg-icon11
                  img(src="../assets/images/landing/stroke-icon/12.svg", alt="php logo")
                h5 Symfony
      .bottom-section-grad
        section.section-space.about-section.pb-0 
          .container-fluid.fluid-space
            .row 
              .col-sm-12
                .landing-title.text-center
                  h5.sub-title Best Customer Feedback
                  h2 The opinions of our 
                    span.gradient-10 valuable  
                    | Customers
                  p
                    | we are always be there for your issues and support.if any query you can ask us on our theme supports
              .col-sm-12 
                .testimonial-slider  
                  .testimonial-box.common-card 
                    .rating-content 
                      ul.d-flex.ratings.gap-1
                        li
                          i.fa.fa-star
                        li
                          i.fa.fa-star
                        li
                          i.fa.fa-star
                        li
                          i.fa.fa-star
                        li
                          i.fa.fa-star
                      h6.mb-0
                        | Feature Availability
                    p.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.f-light A very very good template.
                    .text-end.mt-2  
                      h5 flucadetena
                      span.font-primary CUSTOMER
                    .customer-img
                      img(src="../assets/images/landing/testimonial/1.svg", alt="vector men")
                  .testimonial-box.common-card 
                      .rating-content 
                        ul.d-flex.ratings.gap-1
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                        h6.mb-0
                          | Design Quality
                      p.f-light I really love the Design.
                      p.f-light  I am using the React Option btw.
                      p.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.
                      .text-end.mt-2  
                        h5 MenschenToaster
                        span.font-primary CUSTOMER
                      .customer-img
                        img(src="../assets/images/landing/testimonial/2.svg", alt="vector men") 
                  .testimonial-box.common-card 
                      .rating-content 
                        ul.d-flex.ratings.gap-1
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                        h6.mb-0
                          | Code Quality
                      p.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.
                      .text-end.mt-2 
                        h5 manthandesai999 
                        span.font-primary CUSTOMER
                      .customer-img
                        img(src="../assets/images/landing/testimonial/3.svg", alt="vector women")
                  .testimonial-box.common-card 
                      .rating-content 
                        ul.d-flex.ratings.gap-1
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                        h6.mb-0
                          | Code Quality
                      p.f-light This is amazing! Seriously great job right here. Please increase price because you are simply offering this nearly for free.
                      .text-end.mt-2 
                        h5 maidot
                        span.font-primary CUSTOMER
                      .customer-img
                        img(src="../assets/images/landing/testimonial/1.svg", alt="vector men")      
                  .testimonial-box.common-card 
                      .rating-content 
                        ul.d-flex.ratings.gap-1
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                          li
                            i.fa.fa-star
                        h6.mb-0
                          | Customer Support
                      p.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
                      .text-end.mt-2 
                        h5 mahbuburriad
                        span.font-primary CUSTOMER
                      .customer-img
                        img(src="../assets/images/landing/testimonial/2.svg", alt="vector men")
        section.faq-section.section-space#faq
          .container
            .row 
              .col-sm-12
                .landing-title.text-center
                  h5.sub-title Frequently Ask Question
                  h2 Do you have  
                    span.gradient-11 any Question? 
                    | Look Here
                  p
                    | You can freely reach out to us at any time with any questions! We'd always be happy to serve you.
                .vector-image 
                  img(src="../assets/images/landing/vectors/4.svg", alt="vector women")
              .col-sm-12 
                #faqaccordion.accordion
                  .accordion-item
                    h2#faq1.accordion-header
                      button.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?
                    #faqOne.accordion-collapse.collapse.show(aria-labelledby='faq1' data-bs-parent='#faqaccordion')
                      .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. 
                  .accordion-item
                    h2#faq2.accordion-header
                      button.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?
                    #faqTwo.accordion-collapse.collapse(aria-labelledby='faq2' data-bs-parent='#faqaccordion')
                      .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.
                  .accordion-item
                    h2#faq3.accordion-header
                      button.accordion-button.collapsed(type='button' data-bs-toggle='collapse' data-bs-target='#faqThree' aria-expanded='false' aria-controls='faqThree')
                        | Are there any hidden fees?
                    #faqThree.accordion-collapse.collapse(aria-labelledby='faq3' data-bs-parent='#faqaccordion')
                      .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.
                  .accordion-item
                    h2#faq4.accordion-header
                      button.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?
                    #faqFour.accordion-collapse.collapse(aria-labelledby='faq4' data-bs-parent='#faqaccordion')
                      .accordion-body.f-light
                        | The item is what you purchase from Envato Market. The end product is what you build with that item.
                  .accordion-item
                    h2#faq5.accordion-header
                      button.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?
                    #faqFive.accordion-collapse.collapse(aria-labelledby='faq5' data-bs-parent='#faqaccordion')
                      .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.
        section.pricing-section.section-space.pt-0
          ul.decoration
            li.loader-line-gif
              img(src="../assets/images/landing/gifs/6.gif", alt="")
            li.loader-gif
              span.loader-1
          .container
            .row
              .col-lg-5
                .landing-title.text-start
                  h5.sub-title Our license
                  h2 Take a Look at Our 
                    span.gradient-12 Engagement Models
                  p.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.
              .col-lg-7 
                .row.g-3
                  .col-sm-6 
                    .pricing-box 
                      h4 Regular License
                      p Use by you in a single product where user 
                        span.font-primary are not charged.
                      ul.license-list 
                        li 
                          img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                          h6.f-light Support for 6 months
                        li 
                          img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                          h6.f-light Free future template updates
                        li 
                          img(src="../assets/images/landing/icon/wrong.png", alt="Wrong icon")
                          h6.f-light Use in an end product that's sold
                      .purchase-details
                        h2 $24.00
                        a.btn.btn-primary.btn-lg.rounded-pill.purchase-btn(href="https://1.envato.market/3GVzd") Purchase now
                  .col-sm-6 
                    .pricing-box 
                      h4 Extended License
                      p Use by you in a single product where user 
                        span.font-primary are charged.
                      ul.license-list
                        li 
                          img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                          h6.f-light Support for 6 months
                        li 
                          img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                          h6.f-light Free future template updates
                        li 
                          img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                          h6.f-light Use in an end product that's sold
                      .purchase-details
                        h2 $499.00
                        a.btn.btn-primary.btn-lg.rounded-pill.purchase-btn(href="https://1.envato.market/3GVzd") Purchase now     
      footer.footer-bg
        .container
          .landing-center.ptb50
            .feature-content
              ul 
                li 
                  h4 Trending Template
                  img(src="../assets/images/landing/feature-img.png", alt="leaf golden")
                li 
                  h4 Overall Best rated Template
                  img(src="../assets/images/landing/feature-img.png", alt="leaf golden")
                li 
                  h4 Weekly Best Seller
                  img(src="../assets/images/landing/feature-img.png", alt="leaf golden")
            .landing-title
              h2 Build a 
                span.gradient-13 stunning site 
                | today
              p The Cuba Bootstrap Admin Theme Trusted By Many Developers World Wide.If You like Our Template So Please Rate Us.
            .footer-content
              ul.license-list
                li 
                  img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                  h6 Free future template updates
                li 
                  img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                  h6 Premium bundled plugins
                li 
                  img(src="../assets/images/landing/icon/right.svg", alt="Right icon")
                  h6 Quality checked by Envato
              a.btn.btn-lg.btn-primary.rounded-pill.purchase-btn(target='_blank' href='https://1.envato.market/3GVzd') Buy Now 
          .sub-footer.row.g-2
            .col-md-6 
              h6.mb-0 Copyright © 2022 Cuba, All rights reserved.
            .col-md-6 
              ul 
                li 
                  h6.mb-0 Find us on
                li 
                  a(href="https://www.facebook.com/")
                    i.fa.fa-facebook-square
                li
                  a(href="https://twitter.com/login") 
                    i.fa.fa-twitter
    include ../../components/landing-footer-files