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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="keywords" content="Tokslaw, Toks Lawal, Tokunbo Lawal">
    <meta name="author" content="Tokslaw, Toks Lawal, Tokunbo Lawal">
    <meta name="description" content="Tokslaw, Product Architect,Robust background in software development and cybersecurity, honed through dedicated service in the US Army. Specializing in leveraging event-driven architecture and advanced methodologies to craft resilient, scalable, and efficient microservices architectures.">
    <meta property="og:title" content="Tokslaw"
    <meta property="og:description" content="Tokslaw, Product Architect,Robust background in software development and cybersecurity, honed through dedicated service in the US Army. Specializing in leveraging event-driven architecture and advanced methodologies to craft resilient, scalable, and efficient microservices architectures.">
    <meta property="og:type" content="website">
    <meta property="og:image" content="./assets/images/common/og-image.jpg">

    <link rel="stylesheet" href="./assets/vendors/liquid-icon/lqd-essentials/lqd-essentials.min.css">
    <link rel="stylesheet" href="./assets/css/theme.min.css">
    <link rel="stylesheet" href="./assets/css/utility.min.css">
    <link rel="stylesheet" href="./assets/css/extra.css">
    <link rel="stylesheet" href="./assets/css/demo/start-hub-8/base.css">
    <link rel="stylesheet" href="./assets/css/demo/start-hub-8/start-hub-8.css">

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;700&family=Libre+Baskerville:ital@1&family=Space+Grotesk:wght@600;700&display=swap" rel="stylesheet">

    <title>Tokslaw</title>
</head>

<body data-localscroll-offset="55" data-lqd-cc="true" data-mobile-nav-breakpoint="1199" data-mobile-nav-style="modern" data-mobile-nav-scheme="dark" data-mobile-nav-trigger-alignment="right" data-mobile-header-scheme="gray" data-mobile-logo-alignment="default" data-overlay-onmobile="false" data-disable-animations-onmobile="true">
<div class="bg-white" id="wrap">

    <div class="lqd-sticky-placeholder hidden"></div>
    <header id="site-header" class="main-header" data-sticky-header="true" data-sticky-values-measured="false" data-sticky-options='{"disableOnMobile": true}'>
        <div class="lqd-hide-onstuck module-top py-10 px-35 border-bottom border-black-10 bg-white md:hidden module-header">
            <div class="container-fluid">
                <div class="flex flex-wrap w-full justify-between items-center">
                    <div class="flex w-55percent justify-start">
                        <div class="px-5 bg-lightgray mr-15 ld-fancy-heading relative">
                            <h6 class="ld-fh-element relative text-11 m-0 text-black">Overview </h6>
                        </div>
                        <div class="mr-15 ld-fancy-heading relative">
                            <p class="ld-fh-element relative text-13 m-0"> About Tokslaw👋</p>
                        </div>
                        <a href="#" class="text-13 text-text btn btn-naked btn-icon-right btn-hover-swp btn-has-label">
                            <span data-text="Learn more" class="btn-txt">Learn more </span>
                            <span class="btn-icon">
										<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
									</span>
                            <span class="btn-icon mr-10">
										<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
									</span>
                        </a>
                    </div>
                    <div class="flex w-45percent justify-end">
                        <div class="flex flex-row gap-25 w-auto mr-30">
									<span class="grid-item inline-flex text-18 leading-20 w-20 h-20">
										<a href="https://www.facebook.com/tokunbo.lawal.1485" class="icon social-icon hover:svg-black" target="_blank">
											<span class="sr-only">Facebook-square</span>
											<svg class="w-1em h-1em block relative e-font-icon-svg e-fab-facebook-square" viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg">
												<path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z" fill="#B4B6C6"></path>
											</svg>
										</a>
									</span>
                            <span class="grid-item inline-flex text-18 leading-20 w-20 h-20">
										<a href="#" class="icon social-icon hover:svg-black" target="_blank">
											<span class="sr-only">Twitter</span>
											<svg class="w-1em h-1em block relative e-font-icon-svg e-fab-twitter" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
												<path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z" fill="#B4B6C6"></path>
											</svg>
										</a>
									</span>
                            <span class="grid-item inline-flex text-18 leading-20 w-20 h-20">
										<a href="#" class="icon social-icon hover:svg-black" target="_blank">
											<span class="sr-only">Github</span>
											<svg class="w-1em h-1em block relative e-font-icon-svg e-fab-github" viewBox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
												<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z" fill="#B4B6C6"></path>
											</svg>
										</a>
									</span>
                        </div>
                        <div class="mr-30 lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none">
                            <ul class="reset-ul inline-ul link-13 link-black">
                                <li class="mr-30">
                                    <a href="#" target="_self">
                                        <span class="link-icon hide-if-empty left-icon icon-next-to-label"></span>
                                        Privacy Policy
                                    </a>
                                </li>
                                <li>
                                    <a href="#" target="_self">
                                        <span class="link-icon hide-if-empty left-icon icon-next-to-label"></span>
                                        Contact
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <div class="ld-dropdown-menu flex relative" role="menubar">
									<span class="ld-module-trigger" role="button" data-ld-toggle="true" data-bs-toggle="collapse" data-bs-target="#dropdown-select-language" aria-controls="dropdown-select-language" aria-expanded="false" data-toggle-options='{ "type":  "hoverFade" }'>
										<span class="ld-module-trigger-txt text-14 text-black">🇺🇸 English <i class="lqd-icn-ess icon-ion-ios-arrow-down"></i></span>
									</span>
                            <div class="ld-module-dropdown left collapse absolute" id="dropdown-select-language" aria-expanded="false" role="menuitem">
                                <div class="link-black ld-dropdown-menu-content">
                                    <ul>
                                        <li><a>Dutch</a></li>
                                        <li><a>French</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="border-bottom border-black-10 px-35 py-0 bg-white md:hidden module-header">
            <div class="container-fluid">
                <div class="flex justify-between items-center w-full">
                    <div class="flex w-60percent lg:w-75percent">
                        <div class="py-10 pr-35 module-logo flex navbar-brand-plain">
                            <a class="navbar-brand flex p-0 relative" href="./index-start-hub-8.html" rel="home">
										<span class="navbar-brand-inner post-rel">
											<img class="logo-default" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Tokslaw">
										</span>
                            </a>
                        </div>
                        <div class="module-primary-nav flex">
                            <div class="navbar-collapse inline-flex p-0 lqd-submenu-default-style" id="main-header-collapse" aria-expanded="false" role="navigation">
                                <ul id="primary-nav" class="link-13 link-font-medium link-leading-2em link-black-80 main-nav flex reset-ul inline-ul lqd-menu-counter-right lqd-menu-items-inline main-nav-hover-fill" data-submenu-options='{"toggleType": "fade", "handler": "mouse-in-out"}' data-localscroll="true" data-localscroll-options='{"itemsSelector":"> li > a", "trackWindowScroll": true, "includeParentAsOffset": true}'>
                                    <li>
                                        <a href="./page-start-hub-8-services.html" class="py-15 pr-60">
                                            Services
                                            <span class="link-icon inline-flex hide-if-empty right-icon">
														<i class="lqd-icn-ess icon-ion-ios-arrow-down"></i>
													</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="./page-start-hub-8-projects.html" class="py-15 pr-60">For Business</a>
                                    </li>
                                    <li>
                                        <a href="#solutions" class="py-15 pr-60">
                                            Solutions
                                            <span class="link-icon inline-flex hide-if-empty right-icon">
														<i class="lqd-icn-ess icon-ion-ios-arrow-down"></i>
													</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="./page-start-hub-8-contact.html" class="py-15 pr-60">
                                            Contact
                                            <span class="link-badge text-badge">NEW</span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="flex w-40percent justify-end lg:w-25percent">
                        <div class="mr-10 ld-module-search lqd-module-search-slide-top flex items-center " data-module-style='lqd-search-style-slide-top'>
									<span class="text-black-50 ld-module-trigger collapsed lqd-module-trigger-txt-left lqd-module-show-icon lqd-module-icon-outline" role="button" data-ld-toggle="true" data-bs-toggle="collapse" data-bs-target="#search-header" aria-controls="search-header" aria-expanded="false">
										<span class="ld-module-trigger-txt"></span>
										<span class="ld-module-trigger-icon">
											<i class="text-18 lqd-icn-ess icon-ld-search-2"></i>
										</span>
									</span>
                            <div class="ld-module-dropdown collapse flex w-full flex-col fixed overflow-hidden backface-hidden" id="search-header" aria-expanded="false" role="form">
                                <div class="ld-search-form-container flex flex-col justify-center h-full mx-auto backface-hidden" role="searchbox">
                                    <form role="search" method="get" action="#" class="ld-search-form w-full">
                                        <input class="w-full" type="search" placeholder="Search" value="" name="s">
                                        <span class="input-icon inline-flex items-center justify-center absolute" role="search" data-ld-toggle="true" data-bs-toggle="collapse" data-bs-target="#search-header" aria-controls="search-header" aria-expanded="false">
													<i class="lqd-icn-ess icon-ld-search"></i>
												</span>
                                        <input type="hidden" name="post_type" value="post">
                                    </form>
                                    <p class="lqd-module-search-info">Type and hit enter</p>
                                </div>
                            </div>
                        </div>
                        <a href="#contact-modal" class="btn btn-naked btn-icon-left btn-icon-circle btn-icon-custom-size btn-icon-solid mr-15 text-14 tracking-0/1 text-purple-500 lg:mr-0" data-lity="#contact-modal">
                            <span data-text="Join the community" class="btn-txt">My Internet World </span>
                            <span class="btn-icon mr-10 w-35 h-35 bg-purple-500 rounded-full">
										<svg class="text-14" xmlns="http://www.w3.org/2000/svg" width="19.25" height="19.25" viewBox="0 0 19.25 19.25">
											<path d="M-5.581-5.711V-7.733H-7.6A2.027,2.027,0,0,0-9.625-5.711,2.027,2.027,0,0,0-7.6-3.688,2.027,2.027,0,0,0-5.581-5.711Zm1.019,0V-.647A2.027,2.027,0,0,0-2.539,1.375,2.027,2.027,0,0,0-.517-.647V-5.711A2.027,2.027,0,0,0-2.539-7.733,2.027,2.027,0,0,0-4.562-5.711Zm2.022-8.12H-.517v-2.022a2.027,2.027,0,0,0-2.022-2.022,2.027,2.027,0,0,0-2.022,2.022A2.027,2.027,0,0,0-2.539-13.831Zm0,1.019H-7.6a2.027,2.027,0,0,0-2.022,2.022A2.027,2.027,0,0,0-7.6-8.767h5.063A2.027,2.027,0,0,0-.517-10.789,2.027,2.027,0,0,0-2.539-12.812Zm8.12,2.022v2.022H7.6a2.027,2.027,0,0,0,2.022-2.022A2.027,2.027,0,0,0,7.6-12.812,2.027,2.027,0,0,0,5.581-10.789Zm-1.019,0v-5.063a2.027,2.027,0,0,0-2.022-2.022A2.027,2.027,0,0,0,.517-15.853v5.063A2.027,2.027,0,0,0,2.539-8.767,2.027,2.027,0,0,0,4.562-10.789ZM2.539-2.669H.517V-.647A2.027,2.027,0,0,0,2.539,1.375,2.027,2.027,0,0,0,4.562-.647,2.027,2.027,0,0,0,2.539-2.669Zm0-1.019H7.6A2.027,2.027,0,0,0,9.625-5.711,2.027,2.027,0,0,0,7.6-7.733H2.539A2.027,2.027,0,0,0,.517-5.711,2.027,2.027,0,0,0,2.539-3.688Z" transform="translate(9.625 17.875)" fill="#fff"></path>
										</svg>
									</span>
                        </a>
                        <a href="#contact-modal" class="btn btn-solid btn-hover-txt-switch-change btn-hover-txt-switch btn-hover-txt-switch-y btn-icon-right bg-blue-700 text-13 text-white font-medium rounded-100 shadow-md module-btn-sm lg:hidden" data-lity="#contact-modal">
                            <span data-text="Get the App" class="btn-txt" data-transition-delay="true" data-delay-options='{"elements":  ".lqd-chars" ,  "delayType":  "animation" ,  "startDelay":  0, "delayBetween":  32.5}' data-split-text="true" data-split-options='{"type":  "chars, words"}'> Connect </span>
                            <span class="btn-icon">
										<svg xmlns="http://www.w3.org/2000/svg" width="8.75" height="8.75" viewBox="0 0 8.75 8.75">
											<path d="M2.926-9.324H8.75V-3.5H7.574V-7.355L.82-.574,0-1.395,6.754-8.176H2.926Z" transform="translate(0 9.324)" fill="#fff"></path>
										</svg>
									</span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <div class="lqd-stickybar-wrap lqd-stickybar-right flex flex-row items-end justify-start pointer-events-none md:hidden">
            <a href="#contact-modal" class="btn btn-solid btn-custom-size btn-icon-right pointer-events-auto w-60 h-60 bg-white text-black rounded-full" data-lity="#contact-modal">
						<span class="btn-icon text-black">
							<i aria-hidden="true" class="lqd-icn-ess icon-lqd-pen"></i>
						</span>
            </a>
        </div>
        <div class="lqd-mobile-sec relative">
            <div class="lqd-mobile-sec relative">
                <div class="lqd-mobile-sec-inner navbar-header flex items-stretch w-full">
                    <div class="lqd-mobile-modules-container empty"></div>
                    <button type="button" class="navbar-toggle collapsed nav-trigger style-mobile flex relative items-center justify-end border-none bg-transparent" data-ld-toggle="true" data-bs-toggle="collapse" data-bs-target="#lqd-mobile-sec-nav" aria-expanded="false" data-toggle-options='{ "changeClassnames":  {"html":  "mobile-nav-activated"} }'>
                        <span class="sr-only">Menu</span>
                        <span class="bars inline-block relative z-1">
									<span class="bars-inner flex flex-col w-full h-full">
										<span class="bar inline-block"></span>
										<span class="bar inline-block"></span>
										<span class="bar inline-block"></span>
									</span>
								</span>
                    </button>
                    <a class="navbar-brand flex relative" href="./index-start-hub-8.html">
								<span class="navbar-brand-inner">
									<img class="logo-default" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Starthub Eight">
								</span>
                    </a>
                </div>
                <div class="lqd-mobile-sec-nav w-full absolute z-10">
                    <div class="mobile-navbar-collapse navbar-collapse collapse w-full" id="lqd-mobile-sec-nav" aria-expanded="false" role="navigation">
                        <ul id="mobile-primary-nav" class="reset-ul lqd-mobile-main-nav main-nav nav"data-localscroll="true" data-localscroll-options='{"itemsSelector":"> li > a", "trackWindowScroll": true, "includeParentAsOffset": true}'>
                            <li class="is-active">
                                <a href="./page-start-hub-8-services.html" class="py-15 pr-60">
                                    Services
                                    <span class="link-icon inline-flex hide-if-empty right-icon">
												<i class="lqd-icn-ess icon-ion-ios-arrow-down"></i>
											</span>
                                </a>
                            </li>
                            <li>
                                <a href="./page-start-hub-8-projects.html" class="py-15 pr-60">For Business</a>
                            </li>
                            <li>
                                <a href="#solutions" class="py-15 pr-60">
                                    Solutions
                                    <span class="link-icon inline-flex hide-if-empty right-icon">
												<i class="lqd-icn-ess icon-ion-ios-arrow-down"></i>
											</span>
                                </a>
                            </li>
                            <li>
                                <a href="./page-start-hub-8-contact.html" class="py-15 pr-60">
                                    Contact
                                    <span class="link-badge text-badge">NEW</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </header>

    <main class="contant relative transition-all z-2 bg-yellow-50" id="lqd-site-content">
        <div class="lqd-contents-wrap">

            <!-- Start Banner -->
            <section class="lqd-section banner px-40 z-2" id="banner">
                <div class="right-60 left-auto lqd-fancy-menu lqd-custom-menu lqd-sticky-menu lqd-sticky-menu-floating-vertical">
                    <ul class="link-black reset-ul inline-ul" data-localscroll="true" data-localscroll-options='{"itemsSelector": ">li > a", "trackWindowScroll": true, "includeParentAsOffset": true}'>
                        <li class="mb-10">
                            <a href="#banner">
                                <span class="link-txt">Home </span>
                            </a>
                        </li>
                        <li class="mb-10">
                            <a href="#services">
                                <span class="link-txt">Services </span>
                            </a>
                        </li>
                        <li class="mb-10">
                            <a href="#works">
                                <span class="link-txt">Works </span>
                            </a>
                        </li>
                        <li>
                            <a href="#testimonials">
                                <span class="link-txt">Testimonials </span>
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="module-section flex items-center justify-center rounded-30 bg-bottom-left bg-no-repeat bg-cover py-5percent" style="background-image: url(./assets/images/demo/start-hub-8/banner-bg.jpg);">
                    <div class="container h-full">
                        <div class="row h-full content-between justify-center">
                            <div class="col col-12"></div>
                            <div class="col col-12 col-xl-10 self-center text-center">
                                <div class="relative w-full flex flex-wrap" data-custom-animations="true" data-ca-options='{"animationTarget": "figure", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "80px", "scaleX" : 0.8 , "scaleY" : 0.8 , "opacity" : 0} , "animations": {"y": "0px", "scaleX" : 1 , "scaleY" : 1 , "opacity" : 1}}'>
                                    <div class="absolute z-1 right-0 module-shape-1">
                                        <div class="lqd-imggrp-single block relative">
                                            <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                <figure class="w-full relative">
                                                    <img width="369" height="435" src="./assets/images/demo/start-hub-8/shape-Path.svg" alt="shape">
                                                </figure>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="absolute z-1 top-40 -left-15percent module-shape-2">
                                        <div class="lqd-imggrp-single block relative">
                                            <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                <figure class="w-full relative">
                                                    <img width="57" height="54" src="./assets/images/demo/start-hub-8/shape-Path-141907.svg" alt="shape">
                                                </figure>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="absolute z-1 top-40 -right-10percent module-shape-3">
                                        <div class="lqd-imggrp-single block relative">
                                            <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                <figure class="w-full relative">
                                                    <img width="49" height="14" src="./assets/images/demo/start-hub-8/shape-Path-141908.svg" alt="shape">
                                                </figure>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="absolute z-1 top-170 -right-10percent module-shape-4">
                                        <div class="lqd-imggrp-single block relative">
                                            <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                <figure class="w-full relative">
                                                    <img width="21" height="68" src="./assets/images/demo/start-hub-8/shape-Path-141909.svg" alt="shape">
                                                </figure>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="relative">
                                    <div class="ld-fancy-heading relative mask-text" data-custom-animations="true" data-ca-options='{"animationTarget": ".lqd-split-words .lqd-words .split-inner, .lqd-adv-txt-fig", "duration" : 1000 , "startDelay" : 200 , "delay" : 70 , "ease": "expo.out", "initValues": {"y": "120px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                                        <h1 class="ld-fh-element relative lqd-highlight-classic lqd-highlight-grow-bottom lqd-highlight-reset-onhover lqd-split-words mb-0/5em leading-1/1em" data-inview="true" data-split-text="true" data-split-options='{"type": "words"}'>
													<span class="lqd-adv-txt-item inline-block">
														Empowering
														<img class="lqd-adv-txt-fig relative inline-flex mx-5 vertical-align-middle rounded-full" width="58" height="58" src="./assets/images/demo/start-hub-8/banner.jpg" alt="title shape">
													</span>
                                            <span class="lqd-adv-txt-item">
														 Businesses, with Innovative
														<mark class="lqd-highlight">
															<span class="lqd-highlight-txt">and Architectural</span>
															<span class="lqd-highlight-inner bg-purple-100 bottom-0/1em left-0"></span>
														</mark>
														Excellence.
													</span>
                                        </h1>
                                    </div>
                                    <div class="absolute bottom-0 right-35percent">
                                        <figure id="lqd-draw-shape-banner" class="lqd-draw-shape" data-lqd-draw-shape="true" data-draw-shape-options='{"drawSVG": "0% 0%", "stagger" : 0 , "start": "top center", "end": "center 35%", "scrub" : 1 , "ease": "linear"}'>
                                            <svg xmlns="http://www.w3.org/2000/svg" width="154.927" height="26.983" viewBox="0 0 154.927 26.983">
                                                <path d="M703.5,516.869c.808,1.5,1.533,2.858,2.276,4.21s1.5,2.686,2.562,4.593c.991-1.553,1.734-2.516,2.264-3.585,1.844-3.72,3.561-7.5,5.439-11.2a18.688,18.688,0,0,1,2.626-3.911c2.571-2.9,6.385-2.963,8.474.349,2.866,4.544,5.085,9.494,7.614,14.253.645,1.214,1.413,2.362,2.527,4.207,1.642-3.08,3-5.506,4.243-7.992,1.26-2.529,2.164-5.27,3.671-7.633a13.794,13.794,0,0,1,4.717-4.865c2.622-1.371,5.6.438,7.54,4.1,2.175,4.11,4.138,8.333,6.221,12.492.544,1.088,1.192,2.123,2.1,3.72,1.01-1.569,1.81-2.6,2.381-3.741,1.669-3.34,3.188-6.756,4.885-10.081a26.579,26.579,0,0,1,2.914-4.622c2.426-3.006,6.209-3.163,8.506-.07a64.655,64.655,0,0,1,4.92,8.622c1.16,2.2,2.093,4.524,3.216,6.747a30.7,30.7,0,0,0,2.068,3.031c1.041-1.726,1.925-2.994,2.607-4.362,1.889-3.792,3.546-7.707,5.583-11.414,1.3-2.365,2.811-4.8,6.157-4.732,3.406.067,4.939,2.547,6.27,5.02,2.007,3.726,3.7,7.62,5.573,11.419.615,1.246,1.378,2.419,2.378,4.152a40.1,40.1,0,0,0,2.37-3.627c1.742-3.489,3.378-7.031,5.08-10.541a22.719,22.719,0,0,1,1.558-2.841c3.274-4.836,7.43-4.954,10.736-.169,1.541,2.23,5.976,12.3,7.3,14.677" transform="translate(-699.438 -501.797)" fill="none" stroke="#ff7374" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"></path>
                                            </svg>
                                        </figure>
                                    </div>
                                </div>
                            </div>
                            <div class="col col-12 flex flex-row gap-20 justify-between items-end sm:flex-wrap" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "duration" : 1000 , "startDelay" : 1300 , "delay" : 100 , "ease": "expo.out", "initValues": {"scaleX" : 0.7 , "scaleY" : 0.7 , "rotationY" : 10 , "opacity" : 0} , "animations": {"scaleX" : 1 , "scaleY" : 1 , "rotationY" : 0 , "opacity" : 1}}'>
                                <div class="w-350 max-w-full sm:w-full">
                                    <div class="transition-all hover:scale-1/1 animation-element">
                                        <div class="iconbox flex flex-grow-1 relative mb-20 text-start items-start">
                                            <div class="iconbox-icon-wrap mr-10">
                                                <div class="iconbox-icon-container inline-flex w-40 text-40 text-primary">
                                                    <svg class="w-1em h-auto" xmlns="http://www.w3.org/2000/svg" width="40.472" height="40.472" viewBox="0 0 40.472 40.472">
                                                        <rect width="40.472" height="40.472" fill="none"></rect>
<!--                                                        <path d="M10.529,8h6.745A2.529,2.529,0,0,1,19.8,10.529v1.686a2.529,2.529,0,0,1-2.529,2.529H10.529A2.529,2.529,0,0,1,8,12.216V10.529A2.529,2.529,0,0,1,10.529,8ZM25.706,28.236h6.745a2.529,2.529,0,0,1,2.529,2.529v1.686a2.529,2.529,0,0,1-2.529,2.529H25.706a2.529,2.529,0,0,1-2.529-2.529V30.765A2.529,2.529,0,0,1,25.706,28.236Z" transform="translate(-1.255 -1.255)" fill-rule="evenodd"></path>-->
<!--                                                        <path d="M10.529,18.118h6.745A2.529,2.529,0,0,1,19.8,20.647v11.8a2.529,2.529,0,0,1-2.529,2.529H10.529A2.529,2.529,0,0,1,8,32.452v-11.8A2.529,2.529,0,0,1,10.529,18.118ZM25.706,8h6.745a2.529,2.529,0,0,1,2.529,2.529v11.8a2.529,2.529,0,0,1-2.529,2.529H25.706a2.529,2.529,0,0,1-2.529-2.529v-11.8A2.529,2.529,0,0,1,25.706,8Z" transform="translate(-1.255 -1.255)" fill-rule="evenodd" opacity="0.3"></path>-->
                                                        <img width="67" height="73" src="./assets/images/demo/start-hub-8/product-design.png" alt="shape">

                                                    </svg>
                                                </div>
                                            </div>
                                            <h3 class="lqd-iconbox-heading text-17 mb-0/7em leading-20">Product Design. Scalable, and Secure Solutions through Expert Product Architecture. </h3>
                                        </div>
                                    </div>
                                </div>
                                <div class="w-350 max-w-full sm:w-full">
                                    <div class="transition-all hover:scale-1/1 animation-element">
                                        <div class="iconbox flex flex-grow-1 relative mb-20 text-start items-start">
                                            <div class="iconbox-icon-wrap mr-20">
                                                <div class="iconbox-icon-container inline-flex w-40 text-40 text-primary">
                                                    <svg class="w-1em h-auto" xmlns="http://www.w3.org/2000/svg" width="34.36" height="34.36" viewBox="0 0 34.36 34.36">
                                                        <rect width="34.36" height="34.36" fill="none"></rect>
<!--                                                        <path d="M27.265,18.588l-1,5.991,0,.021A1.432,1.432,0,0,1,24.6,25.752L8.322,22.793A1.432,1.432,0,0,1,7.2,21.778L4.589,12.634a1.432,1.432,0,0,1,1.377-1.825H25.617l.878-3.762A1.689,1.689,0,0,1,28.14,5.741H31.1a1.689,1.689,0,0,1,0,3.378H29.48Z" transform="translate(-1.289 -1.632)" fill-rule="evenodd" opacity="0.3"></path>-->
<!--                                                        <path d="M12.147,40.295a2.147,2.147,0,1,1,2.147-2.147A2.147,2.147,0,0,1,12.147,40.295Zm12.885,0a2.147,2.147,0,1,1,2.147-2.147A2.147,2.147,0,0,1,25.032,40.295Z" transform="translate(-2.842 -10.23)" fill-rule="evenodd"></path>-->

                                                        <img width="67" height="73" src="./assets/images/demo/start-hub-8/web-dev.png" alt="shape">


                                                    </svg>
                                                </div>
                                            </div>
                                            <h3 class="lqd-iconbox-heading text-17 mb-0/7em leading-20">Web Dev. Custom design, technical frameworks and architecture for your application & SEO. </h3>
                                        </div>
                                    </div>
                                </div>
                                <div class="w-350 max-w-full sm:w-full">
                                    <div class="transition-all hover:scale-1/1 animation-element">
                                        <div class="iconbox flex flex-grow-1 relative mb-20 text-start items-start">
                                            <div class="iconbox-icon-wrap mr-20">
                                                <div class="iconbox-icon-container inline-flex w-40 text-40 text-primary">
                                                    <svg class="w-1em h-auto" xmlns="http://www.w3.org/2000/svg" width="39.638" height="39.638" viewBox="0 0 39.638 39.638">
                                                        <rect width="39.638" height="39.638" fill="none"></rect>
<!--                                                        <path d="M24.494,9.848a30.811,30.811,0,0,1,2.96,3.554s-6.757,9.91-14.864,9.91q-.77,0-1.494-.065Z" transform="translate(7.23 6.417)"></path>-->
<!--                                                        <path d="M22,6.817l-4.137,4.137A4.955,4.955,0,0,0,12.91,15.91L7.173,21.646A18.035,18.035,0,0,1,3,15.91S7.054,6,17.864,6A11.478,11.478,0,0,1,22,6.817Z" transform="translate(1.955 3.91)"></path>-->
<!--                                                        <rect width="31.38" height="3.303" transform="translate(8.423 30.447) rotate(-45)" opacity="0.3"></rect>-->

                                                        <img width="67" height="73" src="./assets/images/demo/start-hub-8/mobile-app.png" alt="shape">


                                                    </svg>
                                                </div>
                                            </div>
                                            <h3 class="lqd-iconbox-heading text-17 mb-0/7em leading-20">Mobile App.Design, build, and run standout mobile experience for product </h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Banner -->

            <!-- Start Design Servisec -->
            <section class="lqd-section design-services pt-100 pb-40" id="services" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, figure, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1100 , "startDelay" : 200 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "80px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                <div class="absolute top-0">
                    <div class="ld-particles-container relative w-full">
                        <div class="ld-particles-inner lqd-overlay flex pointer-events-none" id="lqd-particle-design-services" data-particles="true" data-particles-options='{"particles": {"number": {"value" : 5} , "color": {"value" : ["#604CFD", "#F85976", "#FDA44C", "#A2B2C9"]} , "shape": {"type" : ["circle"]} , "opacity": {"value" : 1} , "size": {"value" : 2} , "move": {"enable": true, "direction": "right", "random": true, "out_mode": "out"}} , "interactivity": {"detect_on": "window", "events": {"onhover": {"enable": true, "mode" : ["bubble"]}} , "modes": {"bubble": {"size" : 15}}} , "retina_detect": true}'></div>
                    </div>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="w-450 flex flex-col relative items-center max-w-full text-center mx-auto">
                            <div class="ld-fancy-heading relative w-auto py-5 px-15 bg-gray rounded-100 animation-element">
                                <h6 class="ld-fh-element relative text-12 uppercase tracking-1 text-slate-500 m-0">Design services</h6>
                            </div>
                            <div class="ld-fancy-heading relative mask-text">
                                <h2 class="ld-fh-element relative lqd-highlight-classic lqd-highlight-grow-bottom lqd-highlight-reset-onhover lqd-split-lines mb-0/5em mt-0/25em" data-inview="true" data-transition-delay="true" data-delay-options='{"elements": ".lqd-highlight-inner", "delayType": "transition"}' data-split-text="true" data-split-options='{"type": "lines"}'>
                                    New
                                    <mark class="lqd-highlight">
                                        <span class="lqd-highlight-txt">ways</span>
                                        <span class="bottom-0 left-0 lqd-highlight-inner bg-purple-100"></span>
                                    </mark>
                                    to build.
                                </h2>
                            </div>
                            <div class="absolute -top-5percent module-shape">
                                <div class="lqd-imggrp-single block relative">
                                    <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                        <figure class="w-full relative">
                                            <img width="67" height="73" src="./assets/images/demo/start-hub-8/Shape.svg" alt="shape">
                                        </figure>
                                    </div>
                                </div>
                            </div>
                            <div class="ld-fancy-heading relative mask-text">
                                <p class="ld-fh-element relative lqd-split-lines text-17 leading-1/3em" data-split-text="true" data-split-options='{"type": "lines"}'>Tokslaw Provides innovative software and solution architecture for product, tailored to meet product needs. My comprehensive solutions are designed to enhance performance, maximize efficiency, and foster innovation.</p>
                            </div>
                        </div>
                        <div class="col col-12 d-xs-none d-sm-none lg:block"></div>
                        <div class="col col-12 flex gap-35 sm:flex-wrap module-iconbox">
                            <div class="max-w-full animation-element">
                                <div class="m-0 py-50 pr-65 pl-45 rounded-20 text-start lqd-iconbox-scale transition-all">
                                    <div class="iconbox flex flex-grow-1 relative flex-col iconbox-default iconbox-contents-show-onhover" data-slideelement-onhover="true" data-slideelement-options='{ "visibleElement":  ".iconbox-icon-wrap, p, h3" ,  "hiddenElement":  ".btn" ,  "alignMid":  true, "triggerElement":  ".lqd-iconbox-scale" }'>
                                        <div class="iconbox-icon-wrap">
                                            <div class="w-35 text-36 mb-40 text-36 mb-40  iconbox-icon-container inline-flex text-primary">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="34.578" height="34.578" viewBox="0 0 34.578 34.578">
                                                    <path d="M1922.288,3873.563a17.289,17.289,0,1,1,17.289-17.289A17.239,17.239,0,0,1,1922.288,3873.563Zm8.415-26.406c-.07,0-.141.071-.211.071l-12.623,4.208a.632.632,0,0,0-.42.421l-4.208,12.622a.258.258,0,0,0-.07.211.662.662,0,0,0,.7.7c.071,0,.14-.07.211-.07l12.623-4.208a.634.634,0,0,0,.421-.421l4.207-12.623a.255.255,0,0,0,.07-.21A.663.663,0,0,0,1930.7,3847.157Zm-8.1,11.317a2.515,2.515,0,1,1,2.515-2.515A2.515,2.515,0,0,1,1922.6,3858.474Z" transform="translate(-1904.999 -3838.985)"></path>
                                                </svg>
                                            </div>
                                        </div>
                                        <h3 class="text-22 mb-0/75em lqd-iconbox-heading">Product Architecture</h3>
                                        <div class="contents">
                                            <p class="text-13 leading-1/25em">End-to-end solutions from concept to deployment, focusing on creating products that are both innovative and secure. I create change and improve products or services through software.</p>
                                            <a href="#contact-modal" class="btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                <span class="btn-txt" data-text="Nos valeurs">Learn More</span>
                                                <span class="btn-icon">
															<i class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
														</span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="max-w-full animation-element">
                                <div class="m-0 py-50 pr-65 pl-45 rounded-20 text-start lqd-iconbox-scale transition-all">
                                    <div class=" iconbox flex flex-grow-1 relative flex-col iconbox-default iconbox-contents-show-onhover" data-slideelement-onhover="true" data-slideelement-options='{ "visibleElement":  ".iconbox-icon-wrap, p, h3" ,  "hiddenElement":  ".btn" ,  "alignMid":  true, "triggerElement":  ".lqd-iconbox-scale" }'>
                                        <div class="iconbox-icon-wrap">
                                            <div class="w-35 text-36 mb-40 iconbox-icon-container inline-flex text-primary">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="37.171" height="37.172" viewBox="0 0 37.171 37.172">
                                                    <path d="M2602.153,3857.568a3.684,3.684,0,0,0-2.223-3.291,3.953,3.953,0,0,1-2.462-5.953,3.552,3.552,0,0,0-4.658-4.658,3.947,3.947,0,0,1-5.948-2.461,3.553,3.553,0,0,0-6.589,0,3.947,3.947,0,0,1-5.948,2.461,3.551,3.551,0,0,0-4.658,4.658,3.957,3.957,0,0,1-2.461,5.953,3.549,3.549,0,0,0,0,6.584,3.951,3.951,0,0,1,2.461,5.948,3.551,3.551,0,0,0,4.658,4.659,3.95,3.95,0,0,1,5.948,2.465,3.554,3.554,0,0,0,6.589,0,3.947,3.947,0,0,1,5.948-2.465,3.552,3.552,0,0,0,4.658-4.659,3.948,3.948,0,0,1,2.462-5.948A3.692,3.692,0,0,0,2602.153,3857.568Zm-18.586,6.82a6.816,6.816,0,1,1,6.812-6.812A6.813,6.813,0,0,1,2583.568,3864.388Z" transform="translate(-2564.982 -3838.982)"></path>
                                                </svg>
                                            </div>
                                        </div>
                                        <h3 class="text-22 mb-0/75em lqd-iconbox-heading">Software </h3>
                                        <div class="contents">
                                            <p class="text-13 leading-1/25em">Building custom solutions with an emphasis on Scalability, reliability and performance.– putting passion, pride and plenty </p>
                                            <a href="#contact-modal" class="btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                <span class="btn-txt" data-text="Nos valeurs">Learn More</span>
                                                <span class="btn-icon">
															<i class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
														</span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="max-w-full animation-element">
                                <div class="py-50 pr-65 pl-45 rounded-20 m-0 text-start lqd-iconbox-scale transition-all">
                                    <div class=" iconbox flex flex-grow-1 relative flex-col iconbox-default iconbox-contents-show-onhover" data-slideelement-onhover="true" data-slideelement-options='{ "visibleElement":  ".iconbox-icon-wrap, p, h3" ,  "hiddenElement":  ".btn" ,  "alignMid":  true, "triggerElement":  ".lqd-iconbox-scale" }'>
                                        <div class="iconbox-icon-wrap">
                                            <div class="w-35 text-36 mb-40  iconbox-icon-container inline-flex text-primary">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="27.435" height="32.77" viewBox="0 0 27.435 32.77">
                                                    <path d="M2264.9,3864.935a1.872,1.872,0,0,1-1.383.969H2239.9a1.869,1.869,0,0,1-1.385-.969c-1.349-2.566.236-3.989,1.087-4.754a3.907,3.907,0,0,0,.838-.915c.015-.023.023-.041.033-.057.608-1,.83-3.413.961-4.856.02-.214.038-.418.057-.611,0-.016,0-.034.006-.052a17.656,17.656,0,0,1,2.864-7.749,9.087,9.087,0,0,1,4.739-3.535,2.616,2.616,0,0,1,5.215,0,9.1,9.1,0,0,1,4.74,3.536,17.631,17.631,0,0,1,2.862,7.741c0,.026.005.044.007.062.019.191.039.4.058.609.133,1.444.353,3.859.958,4.851.015.025.028.047.038.067a3.967,3.967,0,0,0,.838.911C2264.668,3860.946,2266.251,3862.37,2264.9,3864.935Zm-16,3.641h5.515a.691.691,0,0,1,.562.263.927.927,0,0,1,.13.764c0,.013-.005.025-.007.036a3.405,3.405,0,0,1-6.775.124l0-.023a1.173,1.173,0,0,1,.116-.935A.588.588,0,0,1,2248.9,3868.575Z" transform="translate(-2237.991 -3839.995)"></path>
                                                </svg>
                                            </div>
                                        </div>
                                        <h3 class="text-22 mb-0/75em lqd-iconbox-heading">Mobile Apps </h3>
                                        <div class="contents">
                                            <p class="text-13 leading-1/25em">
                                                Build engaging cross-platforms and native apps for iOS, Android, or add your custom back-end logic through a process of iteration, wireframing, prototyping and design principles. </p>
                                            <a href="#contact-modal" class="btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                <span class="btn-txt" data-text="Nos valeurs">Learn More</span>
                                                <span class="btn-icon">
															<i class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
														</span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12 text-center mt-35">
                            <div class="w-full flex flex-wrap items-center justify-center transition-all">
                                <div class="module-text-border border-1  rounded-20 border-black-10 transition-all ld-fancy-heading relative hover:inner-text-black animation-element">
                                    <p class="ld-fh-element relative inner-text-black py-10 px-20 m-0 text-slate-300">
                                        Still have a question?
                                        <a href="#" class="text-slate-300 inner-text-black" target="_blank">
                                            <u>Learn More</u>
                                        </a>
                                        or
                                        <a href="#contact-modal" class="text-slate-300 inner-text-black" data-lity="#contact-modal">
                                            <u>contact ME.</u>
                                        </a>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Design Servisec -->

            <!-- Start Services -->
            <section class="lqd-section services pt-50 pb-40" id="features">
                <div class="absolute mb-0 top-0 z-0 max-w-full module-shape">
                    <figure id="lqd-draw-shape-851c9d9" class="lqd-draw-shape" data-lqd-draw-shape="true" data-draw-shape-options='{"drawSVG": "0% 0%", "stagger" : 0 , "start": "top bottom", "end": "center 20%", "scrub" : 1 , "ease": "linear"}'>
                        <svg xmlns="http://www.w3.org/2000/svg" width="255.64" height="182.773" viewBox="0 0 255.64 182.773">
                            <path d="M629.327,2793.022s26.615,148.038,71.511,142.649c13.427-2.278,22.262-11.867,28.131-22.554,8-14.569,9.938-31.107,9.938-31.107s29.991,80.066,62.334,80.06,27.3-44.1,27.3-44.1,9.277,42.023,49.372,50.767" transform="translate(-625.844 -2789.539)" fill="none" stroke="#ff5125" stroke-linecap="round" stroke-linejoin="round" stroke-width="6"></path>
                        </svg>
                    </figure>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col col-12" data-custom-animations="true" data-ca-options='{"animationTarget": ".lqd-split-chars .lqd-chars .split-inner, .lqd-adv-txt-fig", "duration" : 1100 , "delay" : 20 , "ease": "expo.out", "initValues": {"y": "85px", "rotationZ" : 10} , "animations": {"y": "0px", "rotationZ" : 0}}'>
                            <div class="flex flex-wrap relative w-full justify-between items-start">
                                <div class="ld-fancy-heading relative mask-text">
                                    <h2 class="ld-fh-element relative lqd-split-chars mb-0/75em" data-split-text="true" data-split-options='{"type": "chars, words"}'> Creative Services</h2>
                                </div>
                                <div id="services-carousel-nav-container"></div>
                            </div>
                        </div>
                        <div class="col col-12" data-custom-animations="true" data-ca-options='{"animationTarget": ".carousel-items .carousel-item-inner", "duration" : 1100 , "delay" : 100 , "ease": "expo.out", "initValues": {"scaleX" : 0.5 , "scaleY" : 0.5 , "opacity" : 0} , "animations": {"scaleX" : 1 , "scaleY" : 1 , "opacity" : 1}}'>
                            <div class="carousel-container relative carousel-nav-right carousel-nav-right carousel-nav-floated carousel-dots-mobile-outside carousel-dots-mobile-center">
                                <div class="carousel-items relative -mr-10 -ml-10" data-lqd-flickity='{"wrapAround": true, "prevNextButtons": true, "navArrow": "6", "buttonsAppendTo": "#services-carousel-nav-container", "cellAlign": "left", "groupCells": false, "addSlideNumbersToArrows": false, "pageDots": false}'>
                                    <div class="col col-xl-4 col-md-6 col-12 carousel-item flex flex-col justify-center has-one-child px-10">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <div class="pt-20 pb-25 rounded-10 flex flex-col items-center bg-yellow-200">
                                                    <div class="ld-fancy-heading relative">
                                                        <h4 class="ld-fh-element relative text-20 mb-0/25em">Software Development</h4>
                                                    </div>
                                                    <div class="ld-fancy-heading relative">
                                                        <p class="ld-fh-element relative text-15 mb-1em">Custom Software</p>
                                                    </div>
                                                    <div class="w-230 lqd-imggrp-single block relative">
                                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                            <figure class="w-full relative rounded-full">
                                                                <img class="rounded-full" width="458" height="602" src="./assets/images/demo/start-hub-8/DesignDev.jpg" alt="services">
                                                            </figure>
                                                        </div>
                                                    </div>
                                                    <div class="divider w-full">
                                                        <span class="w-full my-25 border-top border-black-20"></span>
                                                    </div>
                                                    <a href="#contact-modal" class="z-10 btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                        <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                                        <span class="btn-icon">
																	<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
																</span>
                                                    </a>
                                                    <a href="./assets/images/demo/start-hub-8/services/services-1.jpg" class="block lqd-overlay flex z-3 fresco" data-fresco-group="true"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-xl-4 col-md-6 col-12 carousel-item flex flex-col justify-center has-one-child px-10">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <div class="pt-20 pb-25 rounded-10 flex flex-col items-center bg-green-200">
                                                    <div class="ld-fancy-heading relative">
                                                        <h4 class="ld-fh-element relative text-20 mb-0/25em">Mobile Application</h4>
                                                    </div>
                                                    <div class="ld-fancy-heading relative">
                                                        <p class="ld-fh-element relative text-15 mb-1em">Design Software</p>
                                                    </div>
                                                    <div class="w-230 lqd-imggrp-single block relative">
                                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                            <figure class="w-full relative rounded-full">
                                                                <img class="rounded-full" width="458" height="602" src="./assets/images/demo/start-hub-8/MobileDesignSoftware.png" alt="services">
                                                            </figure>
                                                        </div>
                                                    </div>
                                                    <div class="divider w-full">
                                                        <span class="w-full my-25 border-top border-black-20"></span>
                                                    </div>
                                                    <a href="#contact-modal" class="z-10 btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                        <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                                        <span class="btn-icon">
																	<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
																</span>
                                                    </a>
                                                    <a href="./assets/images/demo/start-hub-8/services/services-2.jpg" class="block lqd-overlay flex z-3 fresco" data-fresco-group="true"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-xl-4 col-md-6 col-12 carousel-item flex flex-col justify-center has-one-child px-10">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <div class="pt-20 pb-25 rounded-10 flex flex-col items-center bg-yellow-200">
                                                    <div class="ld-fancy-heading relative">
                                                        <h4 class="ld-fh-element relative text-20 mb-0/25em">Software Architecture</h4>
                                                    </div>
                                                    <div class="ld-fancy-heading relative">
                                                        <p class="ld-fh-element relative text-15 mb-1em">Software Design</p>
                                                    </div>
                                                    <div class="w-230 lqd-imggrp-single block relative">
                                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                            <figure class="w-full relative rounded-full">
                                                                <img class="rounded-full" width="458" height="602" src="./assets/images/demo/start-hub-8/Software-Architecture2.png" alt="services">
                                                            </figure>
                                                        </div>
                                                    </div>
                                                    <div class="divider w-full">
                                                        <span class="w-full my-25 border-top border-black-20"></span>
                                                    </div>
                                                    <a href="#contact-modal" class="z-10 btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black" data-lity="#contact-modal">
                                                        <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                                        <span class="btn-icon">
																	<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
																</span>
                                                    </a>
                                                    <a href="./assets/images/demo/start-hub-8/services/services-3.jpg" class="block lqd-overlay flex z-3 fresco" data-fresco-group="true"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-xl-4 col-md-6 col-12 carousel-item flex flex-col justify-center has-one-child px-10">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <div class="pt-20 pb-25 rounded-10 flex flex-col items-center bg-green-200">
                                                    <div class="ld-fancy-heading relative">
                                                        <h4 class="ld-fh-element relative text-20 mb-0/25em">Mobile Development</h4>
                                                    </div>
                                                    <div class="ld-fancy-heading relative">
                                                        <p class="ld-fh-element relative text-15 mb-1em">Development Services</p>
                                                    </div>
                                                    <div class="w-230 lqd-imggrp-single block relative">
                                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                            <figure class="w-full relative rounded-full">
                                                                <img class="rounded-full" width="458" height="602" src="./assets/images/demo/start-hub-8/service-2.jpg" alt="services">
                                                            </figure>
                                                        </div>
                                                    </div>
                                                    <div class="divider w-full">
                                                        <span class="w-full my-25 border-top border-black-20"></span>
                                                    </div>
                                                    <a href="#" class="z-10 btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black">
                                                        <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                                        <span class="btn-icon">
																	<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
																</span>
                                                    </a>
                                                    <a href="./assets/images/demo/start-hub-8/services/services-1.jpg" class="block lqd-overlay flex z-3 fresco" data-fresco-group="true"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-xl-4 col-md-6 col-12 carousel-item flex flex-col justify-center has-one-child px-10">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <div class="pt-20 pb-25 rounded-10 flex flex-col items-center bg-yellow-200">
                                                    <div class="ld-fancy-heading relative">
                                                        <h4 class="ld-fh-element relative text-20 mb-0/25em">Mobile Development</h4>
                                                    </div>
                                                    <div class="ld-fancy-heading relative">
                                                        <p class="ld-fh-element relative text-15 mb-1em">Mobile Application</p>
                                                    </div>
                                                    <div class="w-230 lqd-imggrp-single block relative">
                                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                                            <figure class="w-full relative rounded-full">
                                                                <img class="rounded-full" width="458" height="602" src="./assets/images/demo/start-hub-8/service-1.jpg" alt="services">
                                                            </figure>
                                                        </div>
                                                    </div>
                                                    <div class="divider w-full">
                                                        <span class="w-full my-25 border-top border-black-20"></span>
                                                    </div>
                                                    <a href="#" class="z-10 btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black">
                                                        <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                                        <span class="btn-icon">
																	<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
																</span>
                                                    </a>
                                                    <a href="./assets/images/demo/start-hub-8/services/services-1.jpg" class="block lqd-overlay flex z-3 fresco" data-fresco-group="true"></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Services -->

            <!-- Start Case Studies -->
            <section class="lqd-section case-studies py-40" id="works" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "50px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                <div class="absolute top-40percent z-1 module-shape-1" data-parallax="true" data-parallax-options='{"start": "top bottom", "end": "bottom top"}' data-parallax-from='{"y": "100px", "rotationZ":30}' data-parallax-to='{"y": "-130px", "rotationZ":0}'>
                    <div class="lqd-imggrp-single block relative">
                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                            <figure class="w-full relative">
                                <img width="229" height="242" src="./assets/images/demo/start-hub-8/shape-obj-1.svg" alt="shape">
                            </figure>
                        </div>
                    </div>
                </div>
                <div class="absolute bottom-0 z-1 module-shape-2" data-parallax="true" data-parallax-options='{"start": "top bottom", "end": "bottom top"}' data-parallax-from='{"y": "100px", "rotationZ":30}' data-parallax-to='{"y": "-130px", "rotationZ":0}'>
                    <div class="lqd-imggrp-single block relative">
                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                            <figure class="w-full relative">
                                <img width="121" height="108" src="./assets/images/demo/start-hub-8/shape-obj2.svg" alt="shape">
                            </figure>
                        </div>
                    </div>
                </div>
                <div class="container">
                    <div class="row justify-center">
                        <div class="col col-12 col-lg-6 col-md-8 text-center mb-20">
                            <div class="ld-fancy-heading relative mask-text">
                                <h6 class="ld-fh-element relative lqd-split-lines text-12 mb-1em tracking-1 uppercase text-slate-700" data-split-text="true" data-split-options='{"type": "lines"}'> SELECTED PROJECTS</h6>
                            </div>
                            <div class="ld-fancy-heading relative mask-text">
                                <h2 class="ld-fh-element relative mb-0/5em lqd-split-lines" data-split-text="true" data-split-options='{"type": "lines"}'> Some of the projects I'm proud of.</h2>
                            </div>
                        </div>
                        <div class="col col-12" data-custom-animations="true" data-ca-options='{"animationTarget": ".lqd-pf-item", "duration" : 1200 , "startDelay" : 200 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "80px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                            <div class="lqd-pf-grid relative">
                                <div class="absolute -top-120 w-130 max-w-full z-1 module-shape-3">
                                    <div class="lqd-imggrp-single block relative">
                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                            <figure class="w-full relative">
                                                <img width="130" height="130" src="./assets/images/demo/start-hub-8/shape-Img.png" alt="shape">
                                            </figure>
                                        </div>
                                    </div>
                                </div>
                                <div class="liquid-filter-items items-center justify-between">
                                    <div class="liquid-filter-items-inner flex-grow-1">
                                        <span class="liquid-filter-items-label size-md">Filter by</span>
                                        <ul class="text-15 filter-list filter-list-inline size-custom items-center md:hidden" id="pf-filter-case-studies-works">
                                            <li class="active text-15" data-filter="*">
                                                All
                                            </li>
                                            <li class="text-15" data-filter=".branding">
                                                Branding
                                            </li>
                                            <li class="text-15" data-filter=".custom-print">
                                                Custom Print
                                            </li>
                                            <li class="text-15" data-filter=".digital-design">
                                                Custom Software
                                            </li>
                                            <li class="text-15" data-filter=".ecommerce">
                                                Mobile App
                                            </li>
                                        </ul>
                                        <div class="lqd-filter-dropdown hidden md:block" data-form-options='{ "dropdownAppendTo":  "self" }'>
                                            <select name="lqd-filter-dropdown-pf-filter-case-studies-works" id="lqd-filter-dropdown-pf-filter-case-studies-works">
                                                <option selected data-filter="*" value="*">All</option>
                                                <option data-filter=".branding" value=".branding">Branding</option>
                                                <option data-filter=".custom-print" value=".custom-print">Custom Print</option>
                                                <option data-filter=".digital-design" value=".digital-design">Custom Software</option>
                                                <option data-filter=".ecommerce" value=".ecommerce">Mobile App</option>
                                            </select>
                                        </div>
                                        <a href="./page-start-hub-8-projects.html" class="btn btn-naked btn-icon-right btn-hover-swp text-black" target="_blank">
													<span class="flex items-center justify-center">
														<span class="btn-txt" data-text="Start a project">Start a project</span>
														<span class="btn-icon">
															<i class="lqd-icn-ess icon-md-arrow-forward"></i>
														</span>
														<span class="btn-icon mr-10">
															<i class="lqd-icn-ess icon-md-arrow-forward"></i>
														</span>
													</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="lqd-pf-row row flex flex-wrap -mr-10 -ml-10" data-liquid-masonry="true" data-masonry-options='{ "filtersID":  "#pf-filter-case-studies-works" ,  "filtersCounter":  true }'>
                                    <div class="lqd-pf-column col-md-6 col-sm-6 col-xs-12 masonry-item digital-design ecommerce portfolio-single px-10">
                                        <article class="lqd-pf-item lqd-pf-item-style-1 lqd-pf-dark pf-details-h-end relative overflow-hidden liquid-portfolio type-liquid-portfolio status-publish format-standard has-post-thumbnail hentry liquid-portfolio-category-digital-design liquid-portfolio-category-ecommerce liquid-portfolio-category-portfolio-single">
                                            <div class="lqd-pf-item-inner">
                                                <div class="lqd-pf-img">
                                                    <figure class="w-full">
                                                        <img width="1132" height="540" src="./assets/images/demo/start-hub-8/MyFit.png" alt="case-studies">
                                                    </figure>
                                                </div>
                                                <div class="lqd-pf-details flex flex-wrap relative">
                                                    <span class="lqd-pf-overlay-bg lqd-overlay flex"></span>
                                                    <div class="lqd-pf-info flex flex-wrap items-center justify-between w-full py-1/5em px-1/5em bg-white rounded-4">
                                                        <h2 class="lqd-pf-title mt-0 mb-0 text-18 tracking-0">MyFit</h2>
                                                        <ul class="reset-ul inline-nav lqd-pf-cat inline-flex relative z-2">
                                                            <li>
                                                                <a href="https://myfit.ai/">AI-Powered Smart Personal Health System</a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <a href="https://myfit.ai/" class="lqd-overlay flex lqd-pf-overlay-link" target="_blank"></a>
                                            </div>
                                        </article>
                                    </div>
                                    <div class="lqd-pf-column col-md-6 col-sm-6 col-xs-12 masonry-item ecommerce masonry portfolio-single px-10">
                                        <article class="lqd-pf-item lqd-pf-item-style-1 lqd-pf-dark pf-details-h-end relative overflow-hidden liquid-portfolio type-liquid-portfolio status-publish format-standard has-post-thumbnail hentry liquid-portfolio-category-ecommerce liquid-portfolio-category-masonry liquid-portfolio-category-portfolio-single">
                                            <div class="lqd-pf-item-inner">
                                                <div class="lqd-pf-img">
                                                    <figure class="w-full">
                                                        <img width="1130" height="1106" src="./assets/images/demo/start-hub-8/MobileApp.png" alt="MobileApp">
                                                    </figure>
                                                </div>
                                                <div class="lqd-pf-details flex flex-wrap relative">
                                                    <span class="lqd-pf-overlay-bg lqd-overlay flex"></span>
                                                    <div class="lqd-pf-info flex flex-wrap items-center justify-between w-full py-1/5em px-1/5em bg-white rounded-4">
                                                        <h2 class="lqd-pf-title mt-0 mb-0 text-18 tracking-0">WrenchBoard</h2>
                                                        <ul class="reset-ul inline-nav lqd-pf-cat inline-flex relative z-2">
                                                            <li>
                                                                <a href="https://www.wrenchboard.com/">Set Family Goals</a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <a href="https://www.wrenchboard.com/" class="lqd-overlay flex lqd-pf-overlay-link" target="_blank"></a>
                                            </div>
                                        </article>
                                    </div>
                                    <div class="lqd-pf-column col-md-3 col-sm-6 col-xs-12 masonry-item branding custom-print masonry portfolio-single px-10">
                                        <article class="lqd-pf-item lqd-pf-item-style-1 lqd-pf-dark pf-details-h-end relative overflow-hidden liquid-portfolio type-liquid-portfolio status-publish format-standard has-post-thumbnail hentry liquid-portfolio-category-branding liquid-portfolio-category-custom-print liquid-portfolio-category-masonry liquid-portfolio-category-portfolio-single">
                                            <div class="lqd-pf-item-inner">
                                                <div class="lqd-pf-img">
                                                    <figure class="w-full">
                                                        <img width="550" height="520" src="./assets/images/demo/start-hub-8/Infrastructure.png" alt="Infrastructure">
                                                    </figure>
                                                </div>
                                                <div class="lqd-pf-details flex flex-wrap relative">
                                                    <span class="lqd-pf-overlay-bg lqd-overlay flex"></span>
                                                    <div class="lqd-pf-info flex flex-wrap items-center justify-between w-full py-1/5em px-1/5em bg-white rounded-4">
                                                        <h2 class="lqd-pf-title mt-0 mb-0 text-18 tracking-0">Infrastructure</h2>
                                                        <ul class="reset-ul inline-nav lqd-pf-cat inline-flex relative z-2">
                                                            <li>
                                                                <a href="#">Branding</a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <a href="./page-start-hub-8-projects.html" class="lqd-overlay flex lqd-pf-overlay-link" target="_blank"></a>
                                            </div>
                                        </article>
                                    </div>
                                    <div class="lqd-pf-column col-md-3 col-sm-6 col-xs-12 masonry-item branding digital-design masonry portfolio-single px-10">
                                        <article class="lqd-pf-item lqd-pf-item-style-1 lqd-pf-dark pf-details-h-end relative overflow-hidden liquid-portfolio type-liquid-portfolio status-publish format-standard has-post-thumbnail hentry liquid-portfolio-category-branding liquid-portfolio-category-digital-design liquid-portfolio-category-masonry liquid-portfolio-category-portfolio-single">
                                            <div class="lqd-pf-item-inner">
                                                <div class="lqd-pf-img">
                                                    <figure class="w-full">
                                                        <img width="550" height="520" src="./assets/images/demo/start-hub-8/FloatMobility.png" alt="case studies">
                                                    </figure>
                                                </div>
                                                <div class="lqd-pf-details flex flex-wrap relative">
                                                    <span class="lqd-pf-overlay-bg lqd-overlay flex"></span>
                                                    <div class="lqd-pf-info flex flex-wrap items-center justify-between w-full py-1/5em px-1/5em bg-white rounded-4">
                                                        <h2 class="lqd-pf-title mt-0 mb-0 text-18 tracking-0">Float Mobility</h2>
                                                        <ul class="reset-ul inline-nav lqd-pf-cat inline-flex relative z-2">
                                                            <li>
                                                                <a href="https://www.float.sg/">Travel app </a>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                                <a href="https://www.float.sg/" class="lqd-overlay flex lqd-pf-overlay-link" target="_blank"></a>
                                            </div>
                                        </article>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Case Studies -->

            <!-- start Steps Install -->
            <section class="lqd-section steps-install py-90" id="business" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "ease": "power4.out", "initValues": {"x": "95px", "scaleX" : 0.7 , "scaleY" : 0.7 , "opacity" : 0} , "animations": {"x": "0px", "scaleX" : 1 , "scaleY" : 1 , "opacity" : 1}}'>
                <div class="container">
                    <div class="row">
                        <div class="col col-12 col-md-4 col-xl-3 module-first">
                            <div class="flex flex-col relative animation-element">
                                <div class="absolute max-w-full -top-40 right-0">
                                    <div class="ld-fancy-heading relative text-end">
                                        <p class="ld-fh-element relative h1 z-0 mb-0/5em leading-1em">1</p>
                                    </div>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h6 class="ld-fh-element relative mb-0/75em text-14 font-bold uppercase leading-1/2em tracking-1/5 text-black-40">Step 1</h6>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h3 class="ld-fh-element relative mb-0/85em">Concept<br>Idea</h3>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative mb-0/5em text-15 leading-1/4em">Translate your early vision and business requirement into a project blueprint. </p>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12 col-md-4 col-xl-3 module-middle">
                            <div class="flex flex-col relative animation-element">
                                <div class="absolute max-w-full -top-40 right-0">
                                    <div class="ld-fancy-heading relative text-end">
                                        <p class="ld-fh-element relative h1 z-0 mb-0/5em leading-1em">2</p>
                                    </div>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h6 class="ld-fh-element relative mb-0/75em text-14 font-bold uppercase leading-1/2em tracking-1/5 text-black-40">Step 2</h6>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h3 class="ld-fh-element relative mb-0/85em">Software<br>Development </h3>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative text-15 mb-0/5em leading-1/4em">Creative design, technical frameworks and architecture for your application.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12 col-md-4 col-xl-3">
                            <div class="flex flex-col relative animation-element">
                                <div class="absolute max-w-full -top-40 right-0">
                                    <div class="ld-fancy-heading relative text-end">
                                        <p class="ld-fh-element relative h1 z-0 mb-0/5em leading-1em">3</p>
                                    </div>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h6 class="ld-fh-element relative mb-0/75em text-14 font-bold uppercase leading-1/2em tracking-1/5 text-black-40">Step 3</h6>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <h3 class="ld-fh-element relative mb-0/85em">Product<br>Delivery </h3>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative text-15 mb-0/5em leading-1/4em">Quality testing ensuring it is functional, reliable, and meets the end-users' needs & delivery.</p>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12 text-center mt-60 p-0">
                            <div class="w-full flex flex-wrap items-center justify-center transition-all">
                                <div class="module-text-border border-1 rounded-20 border-black-10 transition-all ld-fancy-heading relative hover:inner-text-black animation-element">
                                    <p class="ld-fh-element relative inner-text-black py-10 px-20 m-0 text-slate-300">
                                        Still have a question?
                                        <a href="#" class="text-slate-300 inner-text-black" target="_blank">
                                            <u>Learn More</u>
                                        </a>
                                        or
                                        <a href="#contact" class="text-slate-300 inner-text-black" data-localscroll="true">
                                            <u>contact ME.</u>
                                        </a>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Steps Install -->

            <!-- Start Our Vision -->
            <section class="lqd-section our-vision pt-50 pb-390" id="solutions">
                <div class="absolute w-full max-w-full bottom-0 ltr-left-0">
                    <div class="lqd-throwable-scene relative pointer-events-none overflow-hidden" data-lqd-throwable-scene>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-1" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-200">Software Architecture</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-2" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-100 sm:text-18">Mobile Development</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-3" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-200 sm:text-18">Product Architecture</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-4" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-300 sm:text-18">Creative thinking</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-5" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-blue-200 sm:text-18">Organization</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-6" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-18">Domain Knowledge</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-7" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-orange-300 sm:text-18">Attention to Detail</span>
                        </p>
                        <p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-text-8" data-lqd-throwable-el>
                            <span class="lqd-throwable-element-rot inline-block text-22 font-semibold leading-1/8em py-0/25em px-1/5em text-black rounded-100 bg-green-500 sm:text-18">Design Skills and Patterns </span>
                        </p>
                    </div>
                </div>
                <div class="container-fluid relative xl:p-0">
                    <div class="absolute max-w-full -top-45 z-1 module-shape">
                        <figure id="lqd-draw-shape-our-vision" class="lqd-draw-shape" data-lqd-draw-shape="true" data-draw-shape-options='{"drawSVG": "0% 0%", "stagger" : 0 , "start": "top bottom", "end": "center center", "scrub" : 1 , "ease": "linear"}'>
                            <svg xmlns="http://www.w3.org/2000/svg" width="189.901" height="106.01" viewBox="0 0 189.901 106.01">
                                <path d="M42.52,277.026c5.189-4.909,24.683-30.293,31.134-29.451s-1.473,34.921,7.573,34.5,38.848-41.513,46.7-37.025-7.082,62.9.421,63.952,34.5-63.6,44.6-57.641,7.433,92.492,15.988,93.4,29.451-73.278,35.342-87.934" transform="translate(-38.279 -241.761)" fill="none" stroke="#c78bdd" stroke-linecap="round" stroke-width="6"></path>
                            </svg>
                        </figure>
                    </div>
                    <div class="lqd-section-flow flex-wrap" data-lqd-section-flow="true">
                        <div class="lqd-section-flow-panel lqd-section-flow-panel-start col-12 col-lg-6 px-0">
                            <div class="lqd-section-flow-panel-start-inner sticky top-0 left-0">
                                <div class="lqd-section-flow-item absolute top-0 left-0 w-full overflow-hidden">
                                    <div class="h-vh-100 lqd-section-flow-item-inner">
                                        <img class="h-full object-cover" decoding="async" src="./assets/images/demo/start-hub-8/AI-concept.png" title="section-flow-11" alt="section-flow-11" style="border-radius: 50px;">
                                    </div>
                                </div>
                                <div class="lqd-section-flow-item absolute top-0 left-0 w-full overflow-hidden">
                                    <div class="h-vh-100 lqd-section-flow-item-inner">
                                        <img class="h-full object-cover" decoding="async" src="./assets/images/demo/start-hub-8/Connect-Family.png" title="img-3" alt="img-3" style="border-radius: 50px;">
                                    </div>
                                </div>
                                <div class="lqd-section-flow-item absolute top-0 left-0 w-full overflow-hidden">
                                    <div class="h-vh-100 lqd-section-flow-item-inner">
                                        <img class="h-full object-cover" decoding="async" src="./assets/images/demo/start-hub-8/SoftwareDesign.png" title="section-flow-11" alt="section-flow-11" style="border-radius: 50px;">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="lqd-section-flow-panel lqd-section-flow-panel-end col-12 col-lg-6">
                            <div class="lqd-section-flow-item flex items-center">
                                <div class="lqd-section-flow-item-inner">
                                    <div class="lqd-section-flow-content-mobile">
                                        <img class="h-full object-cover"  decoding="async" src="./assets/images/demo/start-hub-8/AI-concept.png" title="section-flow-11" alt="section-flow-11" style="border-radius: 30px;">
                                    </div>
                                    <div class="flex flex-wrap py-10percent" data-custom-animations="true" data-ca-options='{"animationTarget": "h2, .animation-element, .iconbox, .btn", "duration" : 1000 , "startDelay" : 300 , "delay" : 100 , "ease": "expo.out", "initValues": {"x": "60px", "opacity" : 0} , "animations": {"x": "0px", "opacity" : 1}}'>
                                        <div class="flex flex-wrap pb-200 module-content">
                                            <div class="m-0 px-10 rounded-6 bg-slate-200 ld-fancy-heading relative animation-element">
                                                <h6 class="ld-fh-element inline-block relative mb-0/5em text-12 -tracking-0/5 text-slate-500">Our vision</h6>
                                            </div>
                                            <div class="ld-fancy-heading relative">
                                                <h2 class="ld-fh-element relative lqd-highlight-custom lqd-highlight-custom-2 mt-0/25em mb-0/75em text-38" data-inview="true" data-transition-delay="true" data-delay-options='{"elements": ".lqd-highlight-inner", "delayType": "transition"}'>
                                                    Custom Software Solutions
                                                    <mark class="lqd-highlight">
                                                        <span class="lqd-highlight-txt">functional</span>
                                                        <span class="-bottom-10 left-0 lqd-highlight-inner bg-purple-100">
																	<svg class="lqd-highlight-pen" width="51" height="51" viewBox="0 0 51 51" xmlns="http://www.w3.org/2000/svg">
																		<path d="M36.204 1.044C32.02 2.814 5.66 31.155 4.514 35.116c-.632 2.182-1.75 5.516-2.483 7.409-3.024 7.805-1.54 9.29 6.265 6.265 1.893-.733 5.227-1.848 7.41-2.477 3.834-1.105 4.473-1.647 19.175-16.27 0 0 10.63-10.546 15.21-15.125C53 8.997 42.021-1.418 36.203 1.044Zm7.263 5.369c3.56 3.28 4.114 4.749 2.643 6.995l-1.115 1.7-4.586-4.543-4.585-4.544 1.42-1.157C39.311 3.18 40.2 3.4 43.467 6.413ZM37.863 13.3l4.266 4.304-11.547 11.561-11.547 11.561-4.48-4.446-4.481-4.447 11.404-11.418c6.273-6.28 11.566-11.42 11.762-11.42.197 0 2.277 1.938 4.623 4.305ZM12.016 39.03l3.54 3.584-3.562 1.098-5.316 1.641c-1.665.516-1.727.455-1.211-1.21l1.614-5.226c1.289-4.177.685-4.191 4.935.113Z" />
																	</svg>
																	<svg class="lqd-highlight-brush-svg lqd-highlight-brush-svg-2" width="233" height="13" viewBox="0 0 233 13" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="none">
																		<path d="m.624 9.414-.312-2.48C0 4.454.001 4.454.002 4.454l.035-.005.102-.013.398-.047c.351-.042.872-.102 1.557-.179 1.37-.152 3.401-.368 6.05-.622C13.44 3.081 21.212 2.42 31.13 1.804 50.966.572 79.394-.48 113.797.24c34.387.717 63.927 2.663 84.874 4.429a1048.61 1048.61 0 0 1 24.513 2.34 641.605 641.605 0 0 1 8.243.944l.432.054.149.02-.318 2.479-.319 2.48-.137-.018c-.094-.012-.234-.03-.421-.052a634.593 634.593 0 0 0-8.167-.936 1043.26 1043.26 0 0 0-24.395-2.329c-20.864-1.76-50.296-3.697-84.558-4.413-34.246-.714-62.535.332-82.253 1.556-9.859.612-17.574 1.269-22.82 1.772-2.622.251-4.627.464-5.973.614a213.493 213.493 0 0 0-1.901.22l-.094.01-.028.004Z" fill="#7150E8" />
																	</svg>
																</span>
                                                    </mark>
                                                    scenarios. 🤑
                                                </h2>
                                            </div>
                                            <div class="mb-30 iconbox flex flex-grow-1 relative iconbox-circle iconbox-icon-ripple">
                                                <div class="iconbox-icon-wrap mr-25">
                                                    <div class="iconbox-icon-container inline-flex relative z-1 rounded-full text-24 w-30 h-30 text-accent bg-white shadow-md">
                                                        <i aria-hidden="true" class="lqd-icn-ess icon-lqd-circle"></i>
                                                    </div>
                                                </div>
                                                <p class="text-13 leading-16 m-0 lqd-iconbox-heading">Design, build , brand Custom Solutions and Search Engine Optimitization while merging
                                                    imagination and technology to help your business grow in an age of digital transformation. </p>
                                            </div>
                                        </div>
                                        <a href="./page-asymmetric-agency-case-studies.html" class="text-black btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black">
                                            <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                            <span class="btn-icon">
														<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
													</span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="lqd-section-flow-item flex items-center">
                                <div class="lqd-section-flow-item-inner">
                                    <div class="lqd-section-flow-content-mobile">
                                        <img decoding="async" src="./assets/images/demo/start-hub-8/over-vision-2.jpg" title="img-3" alt="img-3">
                                    </div>
                                    <div class="flex flex-wrap py-10percent" data-custom-animations="true" data-ca-options='{"animationTarget": "h2, .animation-element, .iconbox, .btn", "duration" : 1000 , "startDelay" : 300 , "delay" : 100 , "ease": "expo.out", "initValues": {"x": "60px", "opacity" : 0} , "animations": {"x": "0px", "opacity" : 1}}'>
                                        <div class="flex flex-wrap pb-200 module-content">
                                            <div class="m-0 px-10 rounded-6 bg-slate-200 ld-fancy-heading relative animation-element">
                                                <h6 class="ld-fh-element relative mb-0/5em text-12 -tracking-0/5 text-slate-500">Our vision</h6>
                                            </div>
                                            <div class="ld-fancy-heading relative">
                                                <h2 class="ld-fh-element relative lqd-highlight-custom lqd-highlight-custom-2 mt-0/25em mb-0/75em text-38" data-inview="true" data-transition-delay="true" data-delay-options='{"elements": ".lqd-highlight-inner", "delayType": "transition"}'>
                                                    Mobile Development whereas cross
                                                    <mark class="lqd-highlight">
                                                        <span class="lqd-highlight-txt">functional</span>
                                                        <span class="-bottom-10 left-0 lqd-highlight-inner bg-purple-100">
																	<svg class="lqd-highlight-pen" width="51" height="51" viewBox="0 0 51 51" xmlns="http://www.w3.org/2000/svg"><path d="M36.204 1.044C32.02 2.814 5.66 31.155 4.514 35.116c-.632 2.182-1.75 5.516-2.483 7.409-3.024 7.805-1.54 9.29 6.265 6.265 1.893-.733 5.227-1.848 7.41-2.477 3.834-1.105 4.473-1.647 19.175-16.27 0 0 10.63-10.546 15.21-15.125C53 8.997 42.021-1.418 36.203 1.044Zm7.263 5.369c3.56 3.28 4.114 4.749 2.643 6.995l-1.115 1.7-4.586-4.543-4.585-4.544 1.42-1.157C39.311 3.18 40.2 3.4 43.467 6.413ZM37.863 13.3l4.266 4.304-11.547 11.561-11.547 11.561-4.48-4.446-4.481-4.447 11.404-11.418c6.273-6.28 11.566-11.42 11.762-11.42.197 0 2.277 1.938 4.623 4.305ZM12.016 39.03l3.54 3.584-3.562 1.098-5.316 1.641c-1.665.516-1.727.455-1.211-1.21l1.614-5.226c1.289-4.177.685-4.191 4.935.113Z" /></svg>
																	<svg class="lqd-highlight-brush-svg lqd-highlight-brush-svg-2" width="233" height="13" viewBox="0 0 233 13" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="none"><path d="m.624 9.414-.312-2.48C0 4.454.001 4.454.002 4.454l.035-.005.102-.013.398-.047c.351-.042.872-.102 1.557-.179 1.37-.152 3.401-.368 6.05-.622C13.44 3.081 21.212 2.42 31.13 1.804 50.966.572 79.394-.48 113.797.24c34.387.717 63.927 2.663 84.874 4.429a1048.61 1048.61 0 0 1 24.513 2.34 641.605 641.605 0 0 1 8.243.944l.432.054.149.02-.318 2.479-.319 2.48-.137-.018c-.094-.012-.234-.03-.421-.052a634.593 634.593 0 0 0-8.167-.936 1043.26 1043.26 0 0 0-24.395-2.329c-20.864-1.76-50.296-3.697-84.558-4.413-34.246-.714-62.535.332-82.253 1.556-9.859.612-17.574 1.269-22.82 1.772-2.622.251-4.627.464-5.973.614a213.493 213.493 0 0 0-1.901.22l-.094.01-.028.004Z" fill="#7150E8" /></svg>
																</span>
                                                    </mark>
                                                    scenarios. 🤑
                                                </h2>
                                            </div>
                                            <div class="mb-30 iconbox flex flex-grow-1 relative iconbox-circle iconbox-icon-ripple">
                                                <div class="iconbox-icon-wrap mr-25">
                                                    <div class="iconbox-icon-container inline-flex relative z-1 rounded-full text-24 w-30 h-30 text-accent bg-white shadow-md">
                                                        <i aria-hidden="true" class="lqd-icn-ess icon-lqd-circle"></i>
                                                    </div>
                                                </div>
                                                <p class="text-13 leading-16 m-0 lqd-iconbox-heading">Bring your ideas to life with an intuitive visual diagram and design interfaces with functionality that are User-friendly Passionate about solving problems through creativity. </p>
                                            </div>
                                        </div>
                                        <a href="./page-asymmetric-agency-case-studies.html" class="text-black btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black">
                                            <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                            <span class="btn-icon">
														<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
													</span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="lqd-section-flow-item flex items-center">
                                <div class="lqd-section-flow-item-inner">
                                    <div class="lqd-section-flow-content-mobile">
                                        <img decoding="async" src="./assets/images/demo/start-hub-8/over-vision-1.jpg" title="section-flow-11" alt="section-flow-11">
                                    </div>
                                    <div class="flex flex-wrap py-10percent" data-custom-animations="true" data-ca-options='{"animationTarget": "h2, .animation-element, .iconbox, .btn", "duration" : 1000 , "startDelay" : 300 , "delay" : 100 , "ease": "expo.out", "initValues": {"x": "60px", "opacity" : 0} , "animations": {"x": "0px", "opacity" : 1}}'>
                                        <div class="flex flex-wrap pb-200 module-content">
                                            <div class="m-0 px-10 rounded-6 bg-slate-200 ld-fancy-heading relative animation-element">
                                                <h6 class="ld-fh-element relative mb-0/5em text-12 -tracking-0/5 text-slate-500">Our vision</h6>
                                            </div>
                                            <div class="ld-fancy-heading relative">
                                                <h2 class="ld-fh-element relative lqd-highlight-custom lqd-highlight-custom-2 mt-0/25em mb-0/75em text-38" data-inview="true" data-transition-delay="true" data-delay-options='{"elements": ".lqd-highlight-inner", "delayType": "transition"}'>
                                                    Software Design potentialities
                                                    <mark class="lqd-highlight">
                                                        <span class="lqd-highlight-txt">platform-agnostic</span>
                                                        <span class="-bottom-10 left-0 lqd-highlight-inner bg-purple-100">
																	<svg class="lqd-highlight-pen" width="51" height="51" viewBox="0 0 51 51" xmlns="http://www.w3.org/2000/svg">
																		<path d="M36.204 1.044C32.02 2.814 5.66 31.155 4.514 35.116c-.632 2.182-1.75 5.516-2.483 7.409-3.024 7.805-1.54 9.29 6.265 6.265 1.893-.733 5.227-1.848 7.41-2.477 3.834-1.105 4.473-1.647 19.175-16.27 0 0 10.63-10.546 15.21-15.125C53 8.997 42.021-1.418 36.203 1.044Zm7.263 5.369c3.56 3.28 4.114 4.749 2.643 6.995l-1.115 1.7-4.586-4.543-4.585-4.544 1.42-1.157C39.311 3.18 40.2 3.4 43.467 6.413ZM37.863 13.3l4.266 4.304-11.547 11.561-11.547 11.561-4.48-4.446-4.481-4.447 11.404-11.418c6.273-6.28 11.566-11.42 11.762-11.42.197 0 2.277 1.938 4.623 4.305ZM12.016 39.03l3.54 3.584-3.562 1.098-5.316 1.641c-1.665.516-1.727.455-1.211-1.21l1.614-5.226c1.289-4.177.685-4.191 4.935.113Z" />
																	</svg>
																	<svg class="lqd-highlight-brush-svg lqd-highlight-brush-svg-2" width="233" height="13" viewBox="0 0 233 13" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="none">
																		<path d="m.624 9.414-.312-2.48C0 4.454.001 4.454.002 4.454l.035-.005.102-.013.398-.047c.351-.042.872-.102 1.557-.179 1.37-.152 3.401-.368 6.05-.622C13.44 3.081 21.212 2.42 31.13 1.804 50.966.572 79.394-.48 113.797.24c34.387.717 63.927 2.663 84.874 4.429a1048.61 1048.61 0 0 1 24.513 2.34 641.605 641.605 0 0 1 8.243.944l.432.054.149.02-.318 2.479-.319 2.48-.137-.018c-.094-.012-.234-.03-.421-.052a634.593 634.593 0 0 0-8.167-.936 1043.26 1043.26 0 0 0-24.395-2.329c-20.864-1.76-50.296-3.697-84.558-4.413-34.246-.714-62.535.332-82.253 1.556-9.859.612-17.574 1.269-22.82 1.772-2.622.251-4.627.464-5.973.614a213.493 213.493 0 0 0-1.901.22l-.094.01-.028.004Z" fill="#7150E8" />
																	</svg>
																</span>
                                                    </mark>
                                                    scenarios. 🤑
                                                </h2>
                                            </div>
                                            <div class="mb-30 iconbox flex flex-grow-1 relative iconbox-circle iconbox-icon-ripple">
                                                <div class="iconbox-icon-wrap mr-25">
                                                    <div class="iconbox-icon-container inline-flex relative z-1 rounded-full text-24 w-30 h-30 text-accent bg-white shadow-md">
                                                        <i aria-hidden="true" class="lqd-icn-ess icon-lqd-circle"></i>
                                                    </div>
                                                </div>
                                                <p class="text-13 leading-16 m-0 lqd-iconbox-heading">Content-focused grid designs, unique social elements, post-sharing function, author exposure, sticky newsletter.iteration and prototyping, we design interfaces that bring joy to people while allowing them to get things done. </p>
                                            </div>
                                        </div>
                                        <a href="./page-asymmetric-agency-case-studies.html" class="text-black btn btn-underlined border-thin btn-icon-right btn-hover-reveal text-black before:bg-black">
                                            <span data-text="Nos valeurs" class="btn-txt">Learn More </span>
                                            <span class="btn-icon">
														<i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
													</span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Our Vision -->

            <!-- Start Testimonials -->
            <section class="lqd-section testimonials py-90" id="testimonials">
                <div class="absolute max-w-full top-145 module-shape-1 sm:hidden">
                    <figure id="lqd-draw-shape-8a1e8a2" class="lqd-draw-shape" data-lqd-draw-shape="true" data-draw-shape-options='{"ease": "linear", "start": "top bottom", "end": "bottom top"}'>
                        <svg xmlns="http://www.w3.org/2000/svg" width="124" height="70" viewBox="0 0 124 70" fill="none">
                            <path d="M3 24.5L22 4.5L27.5 28L57.5 3L59 44.5L86.5 7C90.5 27.3333 98.5 67.9 98.5 67.5C98.5 67.1 113.5 29.3333 121 10.5" stroke="url(#paint0_linear_9_4)" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"></path>
                            <defs>
                                <linearGradient id="paint0_linear_9_4" x1="3.27765e-07" y1="23.5" x2="123.5" y2="15.5" gradientUnits="userSpaceOnUse">
                                    <stop offset="0" stop-color="#FFBC5C"></stop>
                                    <stop offset="1" stop-color="#DF2EAC"></stop>
                                </linearGradient>
                            </defs>
                        </svg>
                    </figure>
                </div>
                <div class="absolute max-w-full top-210 module-shape-2">
                    <figure id="lqd-draw-shape-0edcc08" class="lqd-draw-shape" data-lqd-draw-shape="true" data-draw-shape-options='{"ease": "linear", "start": "top bottom", "end": "bottom top"}'>
                        <svg xmlns="http://www.w3.org/2000/svg" width="130" viewBox="0 0 273 59" fill="none">
                            <path d="M9.07199 47.295C9.07199 47.295 28.196 9 55.436 9C82.676 9 78.603 45.336 107.331 45.336C136.059 45.336 143.537 14.3454 171.031 12.909C198 11.5 192.661 49.287 222.631 49.287C246.364 49.287 263.718 15.108 263.718 15.108" stroke="url(#paint0_linear_22_3)" stroke-width="18" stroke-linecap="round"></path>
                            <defs>
                                <linearGradient id="paint0_linear_22_3" x1="136.395" y1="9" x2="136.395" y2="49.287" gradientUnits="userSpaceOnUse">
                                    <stop offset="0" stop-color="#FFED00"></stop>
                                    <stop offset="1" stop-color="#FF00FF"></stop>
                                </linearGradient>
                            </defs>
                        </svg>
                    </figure>
                </div>
                <div class="container-fluid">
                    <div class="row justify-center">
                        <div class="col col-12 col-md-8 mb-60 p-0 text-center" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, figure, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "60px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                            <div class="flex flex-col items-center px-20">
                                <div class="ld-fancy-heading relative mask-text">
                                    <p class="ld-fh-element relative lqd-split-lines text-18 mb-1/5em text-slate-400" data-split-text="true" data-split-options='{"type": "lines"}'> Trusted by Enterprise Architects , Full Stack Engineers, Product & Software Lovers</p>
                                </div>
                                <div class="ld-fancy-heading relative mask-text">
                                    <h2 class="mb-0 ld-fh-element relative lqd-split-lines" data-split-text="true" data-split-options='{"type": "lines"}'> Intuitive</h2>
                                </div>
                                <div class="ld-fancy-heading relative mask-text">
                                    <h2 class="ld-fh-element relative lqd-highlight-classic lqd-highlight-grow-left lqd-split-lines h2 mb-0/75em" data-split-text="true" data-split-options='{"type": "lines"}'>
                                        <span class="lqd-adv-txt-item">Blog</span>
                                        <span class="relative z-3 lqd-adv-txt-item">
													<span class="relative inline-flex rounded-full vertical-top -mr-30">
														<img class="lqd-adv-txt-fig w-55 border-5 border-white rounded-full" decoding="async" width="58" height="58" src="./assets/images/demo/start-hub-8/Shape-avatar-1.jpg" alt="testimonials avatar">
													</span>
												</span>
                                        <span class="relative z-2 lqd-adv-txt-item">
													<span class="relative inline-flex rounded-full vertical-top -mr-35">
														<img class="lqd-adv-txt-fig w-55 border-5 border-white rounded-full" decoding="async" width="58" height="58" src="./assets/images/demo/start-hub-8/Shape-avatar-2.jpg" alt="testimonials avatar">
													</span>
												</span>
                                        <span class="relative z-1 lqd-adv-txt-item">
													<span class="relative inline-flex rounded-full vertical-top">
														<img class="lqd-adv-txt-fig w-55 border-5 border-white rounded-full" decoding="async" width="58" height="58" src="./assets/images/demo/start-hub-8/Shape-avatar-1.jpg" alt="testimonials avatar">
													</span>
												</span>
                                        <span class="lqd-adv-txt-item">Articles.</span>
                                    </h2>
                                </div>
                                <div class="flex py-10 pr-15 pl-25 items-center bg-gray-100 rounded-6 animation-element sm:w-full">
                                    <div class="max-w-full w-30 lqd-imggrp-single block relative">
                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                                            <figure class="w-full relative">
                                                <img width="30" height="30" src="./assets/images/demo/start-hub-8/g2.png" alt="g2 shape">
                                            </figure>
                                        </div>
                                    </div>
                                    <div class=" ml-10 ld-fancy-heading relative animation-element">
                                        <p class="ld-fh-element relative text-14 font-medium m-0 text-slate-600">Riveting information</p>
                                    </div>
                                    <div class="star-rating pl-10 text-slate-600 animation-element" title="5/5">
                                        <i class="star-full">&#9733;</i>
                                        <i class="star-full">&#9733;</i>
                                        <i class="star-full">&#9733;</i>
                                        <i class="star-full">&#9733;</i>
                                        <i class="star-full">&#9733;</i>
                                        <span class="sr-only">5/5</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col col-12" data-custom-animations="true" data-ca-options='{"animationTarget": ".carousel-container .carousel-item-inner", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"x": "30px", "opacity" : 0} , "animations": {"x": "0px", "opacity" : 1}}'>
                            <div class="carousel-container carousel-dots-style4 carousel-dots-mobile-outside carousel-dots-mobile-center" id="ld-testimonial-carousel">
                                <div class="carousel-items relative" data-lqd-flickity='{"cellAlign": "center", "groupCells": true, "wrapAround": true, "pageDots": true, "prevNextButtons": false, "dotsIndicator": "dots", "dotsAppendTo": "self"}'>

                                    <?php
                                    foreach ($blogdata as $item){
                                        ?>
                                        <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">
                                            <div class="carousel-item-inner relative w-full">

                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-blue-100 module-content ">
                                                    <a href="<?=$item['guid']?>">
                                                        <div style="flex-direction: column">
                                                            <div style="padding: 5px; color:black; font-weight:bolder; font-size:22px; font-family: 'Space Grotesk';"><?=$item['post_title']?><br></div>
                                                            <div class= "br-10" style= "height: 310px;
                                                                    background-image: url(<?=$blog_media_url?>/<?=$item['meta_value']?>);
                                                                    border-radius: 15px;
                                                                    ">
                                                                <!--                                                            <img style="border-radius: 10px;" src="--><?php //=$blog_media_url?><!--/--><?php //=$item['meta_value']?><!--" alt="Tokslaw">-->
                                                            </div class>
                                                        </div>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>

                                        <?php
                                    }
                                    ?>

<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-green-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-green-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Blog data. Blog data. Blog data.Blog data. Blog data. Blog data.-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-1.png" alt="Daniel Sans">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-green-600 text-18">Daniel Sans, </h3>-->
<!--                                                                <h4 class="font-weight-light text-green-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-orange-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-orange-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Incredible theme and fantastic support! Every time I had a question, they got back to you so quickly and fixed your problem! Im so impressed! Thank you guys again for your precious help! Your customer support is amazing!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-2.png" alt="ritamjahed">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-orange-600 text-18">ritamjahed</h3>-->
<!--                                                                <h4 class="font-weight-light text-orange-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-blue-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-blue-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                I'm early on in the process of building my website; however, I'm already impressed by customer support's response time. Great customer support ratings is something I consider before purchasing a theme.-->
<!--                                                                <br>-->
<!--                                                                Thank you LiquidThemes!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-3.png" alt="myadesigns">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-blue-600 text-18">myadesigns</h3>-->
<!--                                                                <h4 class="font-weight-light text-blue-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-yellow-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-yellow-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Simply perfect! Theme and support are amazing! Frank thanks for the help, always fast and efficient! The best theme and support I've had!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-4.png" alt="leandroMariotto">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-yellow-600 text-18">leandroMariotto</h3>-->
<!--                                                                <h4 class="font-weight-light text-yellow-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-green-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-green-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Bring your ideas to life an intuitive Enterprise Architect. Full Stack Engineer, and Security Lover. Customize your site and see the changes instantly.-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-1.png" alt="Daniel Sans">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-green-600 text-18">Daniel Sans, </h3>-->
<!--                                                                <h4 class="font-weight-light text-green-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-orange-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-orange-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Incredible theme and fantastic support! Every time I had a question, they got back to you so quickly and fixed your problem! Im so impressed! Thank you guys again for your precious help! Your customer support is amazing!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-2.png" alt="ritamjahed">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-orange-600 text-18">ritamjahed</h3>-->
<!--                                                                <h4 class="font-weight-light text-orange-600 text-16">Envato CEO</h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-blue-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-blue-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                I' m early on in the process of building my website; however, I'm already impressed by customer support's response time. Great customer support ratings is something I consider before purchasing a theme.-->
<!--                                                                <br>-->
<!--                                                                Thank you LiquidThemes!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-3.png" alt="myadesigns">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-blue-600 text-18">myadesigns</h3>-->
<!--                                                                <h4 class="font-weight-light text-blue-600 text-16">Envato CEO </h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                    <div class="col col-xl-5 px-30 col-md-6 col-12 carousel-item flex flex-col justify-center">-->
<!--                                        <div class="carousel-item-inner relative w-full">-->
<!--                                            <div class="carousel-item-content relative w-full">-->
<!--                                                <div class="lqd-testi relative lqd-testi-style-1 flex flex-col-reverse lqd-testi-shadow-xs lqd-testi-details-lg lqd-testi-quote-18 lqd-testi-avatar-72 rounded-20 py-30 px-35 bg-yellow-100 module-content">-->
<!--                                                    <div class="lqd-testi-quote text-yellow-600">-->
<!--                                                        <blockquote>-->
<!--                                                            <p class="text-18">-->
<!--                                                                Simply perfect! Theme and support are amazing! Frank thanks for the help, always fast and efficient! The best theme and support I've had!-->
<!--                                                            </p>-->
<!--                                                        </blockquote>-->
<!--                                                    </div>-->
<!--                                                    <div class="lqd-testi-info flex flex-wrap justify-between mb-1em">-->
<!--                                                        <div class="lqd-testi-details flex items-center">-->
<!--                                                            <figure class="lqd-testi-avatar rounded-full overflow-hidden mr-1/5em">-->
<!--                                                                <img decoding="async" class="rounded-full" src="./assets/images/demo/start-hub-8/testi-avatar-4.png" alt="leandroMariotto">-->
<!--                                                            </figure>-->
<!--                                                            <div class="pl-1/5">-->
<!--                                                                <h3 class="text-yellow-600 text-18">leandroMariotto</h3>-->
<!--                                                                <h4 class="font-weight-light text-yellow-600 text-16">Envato CEO </h4>-->
<!--                                                            </div>-->
<!--                                                        </div>-->
<!--                                                    </div>-->
<!--                                                </div>-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </div>-->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Testimonials -->

            <!-- Start Clients -->
            <section class="lqd-section clients pt-100 pb-140" data-custom-animations="true" data-ca-options='{"animationTarget": ".lqd-split-lines .lqd-lines .split-inner, .carousel-container", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "60px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
                <div class="container-fluid">
                    <div class="row">
                        <div class="col col-12 text-center">
                            <div class="ld-fancy-heading relative mask-text">
                                <p class="ld-fh-element relative lqd-split-lines h3 leading-1/5em text-24 mb-2em" data-split-text="true" data-split-options='{"type": "lines"}'> Trusted by Product & Software Engineers.  <span class="text-slate-400">Join Millions of customers around the globe.</span></p>
                            </div>
                        </div>
                        <div class="col col-12">
                            <div class="carousel-container relative carousel-nav-shaped">
                                <div class="carousel-items relative" data-lqd-flickity='{"marquee": true, "marqueeTickerSpeed": "1", "pauseAutoPlayOnHover": false}'>
                                    <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <img width="96" height="29" src="./assets/images/demo/start-hub-8/float-travel-app-logo.svg" alt="float-travel">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <img width="87" height="20" src="./assets/images/demo/start-hub-8/chiefsoft-lg.png" alt="chiefsoft">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <img width="127" height="24" src="./assets/images/demo/start-hub-8/WrenchBoard.webp" alt="WrenchBoard">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <img width="84" height="36" src="./assets/images/demo/start-hub-8/Taborg-lg-bg.png" alt="Taborg">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col col-6 col-xl-3 px-30 carousel-item flex flex-col justify-center">
                                        <div class="carousel-item-inner relative w-full">
                                            <div class="carousel-item-content relative w-full">
                                                <img width="76" height="27" src="./assets/images/demo/start-hub-8/Coregrade logo.png" alt="Coregrade">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- End Clients -->

            <!-- Start Contact Form -->
<!--            <section class="lqd-section contact-form bg-center bg-cover pt-70 pb-100" id="contact" style="background-image: url(./assets/images/demo/start-hub-8/contact-form-bg.jpg);">-->
<!--                <div class="container">-->
<!--                    <div class="row items-end">-->
<!--                        <div class="w-45percent sm:w-full" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element, figure, .lqd-split-lines .lqd-lines .split-inner", "duration" : 1000 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "95px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>-->
<!--                            <div class="relative w-full flex flex-col justify-end pb-40">-->
<!--                                <div class="absolute -top-145percent ltr-left-0 module-shape-1 animation-element">-->
<!--                                    <div id="lqd-lottie-form-contact" class="lqd-lottie"></div>-->
<!--                                </div>-->
<!--                                <div class="absolute -top-55percent module-shape-2">-->
<!--                                    <div class="lqd-imggrp-single block relative">-->
<!--                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">-->
<!--                                            <figure class="w-full relative">-->
<!--                                                <img width="57" height="54" src="./assets/images/demo/start-hub-8/shape-Path-141907.svg" alt="contact form shape">-->
<!--                                            </figure>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="absolute -top-30percent module-shape-3">-->
<!--                                    <div class="lqd-imggrp-single block relative">-->
<!--                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">-->
<!--                                            <figure class="w-full relative">-->
<!--                                                <img width="49" height="14" src="./assets/images/demo/start-hub-8/shape-Path-141908.svg" alt="contact form shape">-->
<!--                                            </figure>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="absolute bottom-85 module-shape-4">-->
<!--                                    <div class="lqd-imggrp-single block relative">-->
<!--                                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">-->
<!--                                            <figure class="w-full relative">-->
<!--                                                <img width="21" height="68" src="./assets/images/demo/start-hub-8/shape-Path-141875.svg" alt="contact form shape">-->
<!--                                            </figure>-->
<!--                                        </div>-->
<!--                                    </div>-->
<!--                                </div>-->
<!--                                <div class="ld-fancy-heading relative mask-text">-->
<!--                                    <h2 class="ld-fh-element inline-block relative lqd-split-lines mb-0/5em text-70" data-split-text="true" data-split-options='{"type": "lines"}'> Have a project in mind?👋</h2>-->
<!--                                </div>-->
<!--                                <div class="ld-fancy-heading relative mask-text w-410 max-w-full">-->
<!--                                    <p class="ld-fh-element inline-block relative lqd-split-lines mb-0/5em text-16 leading-20" data-split-text="true" data-split-options='{"type": "lines"}'> Looking for collaboration? Send an email to <a href="mailto:contact@tokslaw.com" class="text-dark">contact@tokslaw.com</a> to for available for enquires and collaborations, </p>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                        <div class="w-50percent lg:w-55percent sm:w-full" data-custom-animations="true" data-ca-options='{"animationTarget": "h2, .animation-element", "duration" : 1000 , "startDelay" : 500 , "delay" : 100 , "ease": "expo.out", "initValues": {"y": "60px", "scaleX" : 0.8 , "scaleY" : 0.8 , "opacity" : 0} , "animations": {"y": "0px", "scaleX" : 1 , "scaleY" : 1 , "opacity" : 1}}'>-->
<!--                            <div class="ld-fancy-heading relative">-->
<!--                                <h2 class="ld-fh-element relative mb-1em text-32">Send a message</h2>-->
<!--                            </div>-->
<!--                            <div class="lqd-contact-form lqd-contact-form-inputs-underlined lqd-contact-form-button-block lqd-contact-form-button-circle lqd-contact-form-inputs-border-thick bg-white pt-45 pb-50 px-75 rounded-12 animation-element">-->
<!--                                <div role="form">-->
<!--                                    <div class="screen-reader-response animation-element">-->
<!--                                        <p role="status" aria-live="polite" aria-atomic="true"></p>-->
<!--                                    </div>-->
<!--                                    <form action="./assets/php/mailer.php" method="post" class="lqd-cf-form" novalidate="novalidate" data-status="init">-->
<!--                                        <div class="row -mr-15 -ml-15 flex-wrap">-->
<!--                                            <div class="col col-12 col-md-6 px-15">-->
<!--                                                <p>-->
<!--															<span class="lqd-form-control-wrap text">-->
<!--																<input class="border-black-20 text-black text-13" type="text" name="name" value="" size="40" aria-required="true" aria-invalid="false" placeholder="What's your name?">-->
<!--															</span>-->
<!--                                                </p>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 col-md-6 px-15">-->
<!--                                                <p>-->
<!--															<span class="lqd-form-control-wrap email">-->
<!--																<input class="border-black-20 text-black text-13" type="email" name="email" value="" size="40" aria-required="true" aria-invalid="false" placeholder="Email Address">-->
<!--															</span>-->
<!--                                                </p>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 col-md-6 px-15">-->
<!--                                                <p>-->
<!--															<span class="lqd-form-control-wrap tel">-->
<!--																<input class="border-black-20 text-black text-13" type="text" name="topic" value="" size="40" aria-required="true" aria-invalid="false" placeholder="Select a Discussion Topic">-->
<!--															</span>-->
<!--                                                </p>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 col-md-6 px-15">-->
<!--                                                <p>-->
<!--															<span class="lqd-form-control-wrap text">-->
<!--																<input class="border-black-20 text-black text-13" type="text" name="budget" value="" size="40" aria-required="true" aria-invalid="false" placeholder="What's your budget?">-->
<!--															</span>-->
<!--                                                </p>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 px-15">-->
<!--                                                <p>-->
<!--															<span class="lqd-form-control-wrap textarea">-->
<!--																<textarea class="border-black-20 text-black text-13" name="message" cols="10" rows="6" aria-required="true" aria-invalid="false" placeholder="A brief description about your project/request/consultation"></textarea>-->
<!--															</span>-->
<!--                                                </p>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 px-15">-->
<!--														<span class="lqd-form-control-wrap acceptance">-->
<!--															<span class="lqd-cf-form-control lqd-cf-acceptance">-->
<!--																<span class="lqd-cf-list-item">-->
<!--																	<label>-->
<!--																		<input type="checkbox" name="acceptance" value="1" aria-invalid="false">-->
<!--																		<span class="lqd-cf-list-item-label">I am bound by the terms of the Service I accept Privacy Policy</span>-->
<!--																	</label>-->
<!--																</span>-->
<!--															</span>-->
<!--														</span>-->
<!--                                            </div>-->
<!--                                            <div class="col col-12 px-15">-->
<!--                                                <input type="submit" value="— send message" class="lqd-cf-form-control lqd-cf-submit border-0 bg-black text-14 text-white">-->
<!--                                            </div>-->
<!--                                        </div>-->
<!--                                    </form>-->
<!--                                    <div class="lqd-cf-response-output"></div>-->
<!--                                </div>-->
<!--                            </div>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </section>-->
            <!-- End Contact Form -->

        </div>
    </main>

    <div class="lqd-top-scrol-ind fixed top-0 left-0 z-100 w-full pointer-events-none" data-lqd-scroll-indicator="true" data-scrl-indc-options='{"scale":  true, "dir":  "x" ,  "end":  "bottom bottom" ,  "origin":  "left"}' style="background: rgb(249, 249, 249);">
				<span class="lqd-scrl-indc-inner block lqd-overlay flex">
					<span class="lqd-scrl-indc-line block lqd-overlay flex">
						<span class="lqd-scrl-indc-el block lqd-overlay flex" style="background: linear-gradient(90deg, #9f51e0 0%, #8297de 100%)"></span>
					</span>
				</span>
    </div>

    <footer id="site-footer" class="main-footer bg-transparent py-70" style="background-image: linear-gradient(170deg, #2D3140 0%, #19272C 100%);">
        <div class="container">
            <div class="flex flex-wrap">
                <div class="w-20percent mb-30 sm:w-50percent">
                    <div class="ld-fancy-heading relative">
                        <h6 class="ld-fh-element relative mb-3em text-10 font-bold tracking-1 text-white-40 uppercase">COMPANY</h6>
                    </div>
                    <nav class="link-white-80 lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none">
                        <ul class="reset-ul">
                            <li class="mb-15">
                                <a href="#">
                                    Contact Me
                                </a>
                            </li>
                            <li class="mb-15">
                                <a href="#">
                                    FAQ
                                </a>
                            </li>
<!--                            <li class="mb-15">-->
<!--                                <a href="#">-->
<!--                                    Report A Bug-->
<!--                                </a>-->
<!--                            </li>-->
                            <li class="mb-15">
                                <a href="#">
                                   Portfolio
                                </a>
                            </li>
                            <li>
                                <a href="#contact-modal" class="text-slate-300 inner-text-black" data-lity="#contact-modal">
                                    AboutMe
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
                <div class="w-20percent mb-30 sm:w-50percent">
                    <div class="ld-fancy-heading relative">
                        <h6 class="ld-fh-element relative mb-3em text-10 font-bold tracking-1 text-white-40 uppercase">SUPPORT</h6>
                    </div>
                    <nav class="link-white-80 lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none">
                        <ul class="reset-ul">
                            <li class="mb-15">
                                <a href="#">
                                    Privacy Policy
                                </a>
                            </li>
                            <li class="mb-15">
                                <a href="#">
                                    Collaborations
                                </a>
                            </li>
                            <li class="mb-15">
                                <a href="#">
                                    Linkedin
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    Community
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
                <div class="w-20percent mb-30 sm:w-full">
                    <div class="ld-fancy-heading relative">
                        <h6 class="ld-fh-element relative mb-3em text-10 font-bold tracking-1 text-white-40 uppercase">CONNECT</h6>
                    </div>
                    <div class="ld-fancy-heading relative">
                        <h6 class="ld-fh-element inline-block relative mb-0/5em text-9 uppercase tracking-1 text-white-30">REACH ME DIRECTLY</h6>
                    </div>
                    <div class="ld-fancy-heading relative">
                        <p class="ld-fh-element relative mb-1/65em text-18 font-medium text-white">(404) 203 8915</p>
                    </div>
                    <div class="ld-fancy-heading relative">
                        <h6 class="ld-fh-element inline-block relative mb-0/5em text-9 uppercase tracking-1 text-white-30">REACH ME DIRECTLY</h6>
                    </div>
                    <div class="ld-fancy-heading relative">
                        <p class="ld-fh-element relative mb-1/65em text-18 font-medium text-white">contact@tokslaw.com</p>
                    </div>
                </div>
                <div class="w-35percent mb-30 ml-5percent text-center sm:w-full lg:m-0">
                    <div class="flex flex-col justify-center items-center pt-45 pb-60 px-45 mb-2percent rounded-20 border-1 border-white-10 sm:ml-0 module-border">
                        <div class="ld-fancy-heading relative">
                            <h4 class="ld-fh-element mb-1/75em relative text-18 text-white">
                                <span class="text-1/5em mr-0/25em">🎉</span>
                                Join My World
                            </h4>
                        </div>
                        <div class="ld-fancy-heading relative">
                            <p class="ld-fh-element relative mb-1/5em text-16 leading-20 text-white-40 hover:text-white-80">Bring your ideas to life with an intuitive Enterprise Architect. Full Stack Engineer, and Security Lover.  </p>
                        </div>
                        <a href="#contact-modal" target="_blank" rel="nofollow" class="btn btn-solid btn-md btn-hover-txt-switch-change btn-hover-txt-switch btn-hover-txt-switch-y btn-icon-shaped bg-green-50 text-green-400 rounded-100" data-lity="#contact-modal">
                            <span data-text="Join the community" class="btn-txt" data-transition-delay="true" data-delay-options='{"elements":  ".lqd-chars" ,  "delayType":  "animation" ,  "startDelay":  0, "delayBetween":  32.5}' data-split-text="true" data-split-options='{"type":  "chars, words"}'> Join the community </span>
                        </a>
                    </div>
                </div>
                <div class="w-50percent mt-55 flex items-center sm:w-full sm:flex-col module-copyright">
                    <div class="mr-20 lqd-imggrp-single block relative">
                        <div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
                            <figure class="w-full relative">
                                <img width="106" height="32" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Tokslaw">
                            </figure>
                        </div>
                    </div>
                    <div class="ld-fancy-heading relative">
                        <p class="ld-fh-element relative m-0 text-14 text-white-60">© 2024 Tokslaw. Developed by Tokslaw.</p>
                    </div>
                </div>
                <div class="w-50percent mt-55 text-end sm:text-start sm:w-full module-social">
                    <div class="social-icons-wrapper shape-circle flex-wrap gap-30 gap-y-0">
								<span class="grid-item">
									<a href="#" class="icon social-icon social-icon-gitlab" target="_blank">
										<span class="sr-only">Gitlab</span>
										<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M105.2 24.9c-3.1-8.9-15.7-8.9-18.9 0L29.8 199.7h132c-.1 0-56.6-174.8-56.6-174.8zM.9 287.7c-2.6 8 .3 16.9 7.1 22l247.9 184-226.2-294zm160.8-88l94.3 294 94.3-294zm349.4 88l-28.8-88-226.3 294 247.9-184c6.9-5.1 9.7-14 7.2-22zM425.7 24.9c-3.1-8.9-15.7-8.9-18.9 0l-56.6 174.8h132z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                        <span class="grid-item">
									<a href="#" class="icon social-icon social-icon-instagram" target="_blank">
										<span class="sr-only">Instagram</span>
										<svg viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                        <span class="grid-item">
									<a href="#" class="icon social-icon social-icon-spotify" target="_blank">
										<span class="sr-only">Spotify</span>
										<svg viewBox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M248 8C111.1 8 0 119.1 0 256s111.1 248 248 248 248-111.1 248-248S384.9 8 248 8zm100.7 364.9c-4.2 0-6.8-1.3-10.7-3.6-62.4-37.6-135-39.2-206.7-24.5-3.9 1-9 2.6-11.9 2.6-9.7 0-15.8-7.7-15.8-15.8 0-10.3 6.1-15.2 13.6-16.8 81.9-18.1 165.6-16.5 237 26.2 6.1 3.9 9.7 7.4 9.7 16.5s-7.1 15.4-15.2 15.4zm26.9-65.6c-5.2 0-8.7-2.3-12.3-4.2-62.5-37-155.7-51.9-238.6-29.4-4.8 1.3-7.4 2.6-11.9 2.6-10.7 0-19.4-8.7-19.4-19.4s5.2-17.8 15.5-20.7c27.8-7.8 56.2-13.6 97.8-13.6 64.9 0 127.6 16.1 177 45.5 8.1 4.8 11.3 11 11.3 19.7-.1 10.8-8.5 19.5-19.4 19.5zm31-76.2c-5.2 0-8.4-1.3-12.9-3.9-71.2-42.5-198.5-52.7-280.9-29.7-3.6 1-8.1 2.6-12.9 2.6-13.2 0-23.3-10.3-23.3-23.6 0-13.6 8.4-21.3 17.4-23.9 35.2-10.3 74.6-15.2 117.5-15.2 73 0 149.5 15.2 205.4 47.8 7.8 4.5 12.9 10.7 12.9 22.6 0 13.6-11 23.3-23.2 23.3z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                        <span class="grid-item">
									<a href="#" class="icon social-icon social-icon-facebook" target="_blank">
										<span class="sr-only">Facebook</span>
										<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                        <span class="grid-item">
									<a href="#" class="icon social-icon social-icon-twitter" target="_blank">
										<span class="sr-only">Twitter</span>
										<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                        <span class="grid-item">
									<a href="#" class="icon social-icon social-icon-medium" target="_blank">
										<span class="sr-only">Medium</span>
										<svg viewBox="0 0 448 512" xmlns="http://www.w3.org/2000/svg">
											<path d="M0 32v448h448V32H0zm372.2 106.1l-24 23c-2.1 1.6-3.1 4.2-2.7 6.7v169.3c-.4 2.6.6 5.2 2.7 6.7l23.5 23v5.1h-118V367l24.3-23.6c2.4-2.4 2.4-3.1 2.4-6.7V199.8l-67.6 171.6h-9.1L125 199.8v115c-.7 4.8 1 9.7 4.4 13.2l31.6 38.3v5.1H71.2v-5.1l31.6-38.3c3.4-3.5 4.9-8.4 4.1-13.2v-133c.4-3.7-1-7.3-3.8-9.8L75 138.1V133h87.3l67.4 148L289 133.1h83.2v5z" fill="#FFFFFFB0"></path>
										</svg>
									</a>
								</span>
                    </div>
                </div>
            </div>
        </div>
    </footer>
</div>

<!-- Contact Modal -->
<div id="contact-modal" class="lity-modal lqd-modal lity-hide" data-modal-type="fullscreen">
    <div class="lqd-modal-inner">
        <div class="lqd-modal-head"></div>
        <section class="lqd-section lqd-modal-content link-black bg-center bg-cover bg-norepeat" style="background-image: url(./assets/images/common/modal-bg.jpeg);">
            <div class="container min-h-100vh flex items-center flex-wrap">
                <div class="w-55percent relative flex flex-col sm:w-full">
                    <div class="flex flex-col items-start justify-center py-10 pr-100 pl-10 module-content">
                        <div class="ld-fancy-heading">
                            <h2 class="ld-fh-element mb-0/5em text-120 text-black leading-0/8em font-medium">Send a message.</h2>
                        </div>
                        <div class="ld-fancy-heading">
                            <p class="ld-fh-element mb-0/5em text-18">We're here to answer any question you may have.</p>
                        </div>
                        <div class="spacer w-full sm:hidden">
                            <div class="w-full h-140"></div>
                        </div>
                        <div class="w-full flex flex-row flex-grow-1 gap-10 module-info">
                            <div class="w-50percent flex flex-col gap-10">
                                <div class="ld-fancy-heading relative">
                                    <h6 class="ld-fh-element relative mb-0/5em text-14 font-bold text-black mb-0/5em tracking-0">careers</h6>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative mb-0/5em text-16 leading-1/2em mb-0/5em">Would you like to join our growing team?</p>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative mb-0/5em">
                                        <a href="#" class="text-16 font-bold leading-1/2em">contact@tokslaw.com </a>
                                    </p>
                                </div>
                            </div>
                            <div class="w-50percent flex flex-col gap-10 pl-15 sm:pl-0">
                                <div class="ld-fancy-heading relative">
                                    <h6 class="ld-fh-element relative mb-0/5em text-14 font-bold text-black mb-0/5em tracking-0">Feedbacks</h6>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative mb-0/5em text-16 leading-1/2em mb-0/5em">Have a project in mind? Send a message.</p>
                                </div>
                                <div class="ld-fancy-heading relative">
                                    <p class="ld-fh-element relative mb-0/5em">
                                        <a href="#" class="text-16 font-bold leading-1/2em">contact@tokslaw.com </a>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="w-45percent relative flex flex-col sm:w-full p-10 module-form">
                    <div class="lqd-contact-form lqd-contact-form-inputs-underlined lqd-contact-form-button-lg lqd-contact-form-button-block p-10 sm:p-0">
                        <div role="form">
                            <div class="screen-reader-response">
                                <p role="status" aria-live="polite" aria-atomic="true"></p>
                            </div>
                            <form action="./assets/php/mailer.php" method="post" class="lqd-cf-form" novalidate="novalidate" data-status="init">
                                <div class="row -mr-15 -ml-15">
                                    <div class="col col-md-6 px-15">
                                        <p>
													<span class="lqd-form-control-wrap text">
														<input class="text-13 text-black border-black-20 bg-transparent" type="text" name="name" value="" size="40" aria-required="true" aria-invalid="false" placeholder="What's your name?">
													</span>
                                        </p>
                                    </div>
                                    <div class="col col-md-6 px-15">
                                        <p>
													<span class="lqd-form-control-wrap email">
														<input class="text-13 text-black border-black-20 bg-transparent" type="email" name="email" value="" size="40" aria-required="true" aria-invalid="false" placeholder="Email address">
													</span>
                                        </p>
                                    </div>
                                    <div class="col col-md-6 px-15">
                                        <p>
													<span class="lqd-form-control-wrap tel">
														<input class="text-13 text-black border-black-20 bg-transparent" type="text" name="topic" value="" size="40" aria-required="true" aria-invalid="false" placeholder="Select a Discussion Topic">
													</span>
                                        </p>
                                    </div>
                                    <div class="col col-md-6 px-15">
                                        <p>
													<span class="lqd-form-control-wrap text">
														<input class="text-13 text-black border-black-20 bg-transparent" type="text" name="budget" value="" size="40" aria-required="true" aria-invalid="false" placeholder="What's your budget?">
													</span>
                                        </p>
                                    </div>
                                    <div class="col col-12 px-15">
                                        <p>
													<span class="lqd-form-control-wrap textarea">
														<textarea class="text-13 text-black border-black-20 bg-transparent" name="message" cols="10" rows="6" aria-required="true" aria-invalid="false" placeholder="Tell us about your project"></textarea>
													</span>
                                        </p>
                                    </div>
                                    <div class="col col-12 px-15">
												<span class="lqd-form-control-wrap acceptance">
													<span class="lqd-cf-form-control lqd-cf-acceptance">
														<span class="lqd-cf-list-item">
															<label>
																<input type="checkbox" name="acceptance" value="1" aria-invalid="false">
																<span class="lqd-cf-list-item-label">I am bound by the terms of the Service I accept Privacy Policy</span>
															</label>
														</span>
													</span>
												</span>
                                    </div>
                                    <div class="col col-12 text-center px-15">
                                        <input type="submit" value="Send message" class="lqd-cf-form-control text-16 uppercase font-medium leading-1em tracking-1 font-bold bg-primary text-white border-none">
                                    </div>
                                </div>
                            </form>
                            <div class="lqd-cf-response-output"></div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <div class="lqd-modal-foot"></div>
    </div>
</div>
<!-- Contact Modal -->

<!-- Hub wordpress -->
<!--<a class="fixed z-100" href="https://themeforest.net/item/hub-responsive-multipurpose-wordpress-theme/31569152" title="Get Hub WordPress Theme" style="bottom: 2rem; left: 2rem;" target="_blank" rel="nofollow">-->
<!--    <svg width="62" height="62" viewBox="0 0 62 62" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0_4_2)"> <path d="M61.07 30.5719C61.07 31.7719 59.17 32.8429 59.03 34.0039C58.887 35.1899 60.476 36.6829 60.197 37.8219C59.913 38.9789 57.81 39.5649 57.397 40.6639C56.984 41.7629 58.158 43.6079 57.61 44.6499C57.062 45.6919 54.877 45.7639 54.21 46.7339C53.543 47.7039 54.246 49.7709 53.462 50.6549C52.678 51.5389 50.544 51.0819 49.662 51.8669C48.78 52.6519 48.977 54.8239 48.002 55.4969C47.027 56.1699 45.07 55.2149 44.019 55.7679C42.968 56.3209 42.65 58.4739 41.538 58.8959C40.426 59.3179 38.764 57.9169 37.607 58.1959C36.468 58.4759 35.633 60.4959 34.446 60.6339C33.285 60.7739 31.994 59.0159 30.796 59.0159C29.598 59.0159 28.307 60.7729 27.146 60.6339C25.959 60.4909 25.123 58.4759 23.985 58.1959C22.828 57.9119 21.153 59.3079 20.054 58.8909C18.955 58.4739 18.616 56.3119 17.573 55.7629C16.53 55.2139 14.561 56.1629 13.59 55.4919C12.619 54.8209 12.814 52.6449 11.93 51.8609C11.046 51.0769 8.91197 51.5339 8.12997 50.6489C7.34797 49.7639 8.05599 47.7019 7.38199 46.7279C6.70799 45.7539 4.52999 45.6939 3.98199 44.6439C3.43399 43.5939 4.61698 41.7689 4.19498 40.6579C3.77298 39.5469 1.67599 38.9739 1.39499 37.8159C1.11499 36.6769 2.70398 35.1849 2.56198 33.9979C2.42298 32.8369 0.521973 31.7649 0.521973 30.5669C0.521973 29.3689 2.42198 28.2959 2.56198 27.1359C2.70498 25.9499 1.11599 24.4559 1.39499 23.3179C1.67899 22.1609 3.78098 21.5749 4.19498 20.4759C4.60898 19.3769 3.43399 17.5319 3.98199 16.4899C4.52999 15.4479 6.71599 15.3759 7.38199 14.4049C8.04799 13.4339 7.34597 11.3679 8.12997 10.4839C8.91397 9.59991 11.048 10.0569 11.93 9.2719C12.812 8.4869 12.615 6.31489 13.59 5.64089C14.565 4.96689 16.522 5.9229 17.573 5.3709C18.624 4.8189 18.942 2.66491 20.054 2.24291C21.166 1.82091 22.828 3.22189 23.985 2.94289C25.124 2.66289 25.96 0.642903 27.146 0.504903C28.307 0.365903 29.598 2.12291 30.796 2.12291C31.994 2.12291 33.286 0.365903 34.447 0.504903C35.633 0.647903 36.469 2.66289 37.608 2.94289C38.765 3.22789 40.44 1.83091 41.539 2.24791C42.638 2.66491 42.977 4.82691 44.02 5.37591C45.063 5.92491 47.032 4.97589 48.002 5.64589C48.972 6.31589 48.778 8.49291 49.662 9.27691C50.546 10.0609 52.681 9.60391 53.462 10.4889C54.243 11.3739 53.536 13.4359 54.209 14.4099C54.882 15.3839 57.061 15.4439 57.609 16.4949C58.157 17.5459 56.974 19.3689 57.396 20.4809C57.818 21.5929 59.915 22.1659 60.196 23.3229C60.476 24.4619 58.887 25.9549 59.029 27.1409C59.169 28.3009 61.07 29.3729 61.07 30.5719Z" fill="#E1E6EA"/> <path d="M16.827 31.128C16.8266 33.7663 17.569 36.3515 18.9693 38.5876C20.3696 40.8237 22.3712 42.6204 24.745 43.772L18.045 25.411C17.2419 27.2098 16.8276 29.158 16.829 31.128H16.827ZM40.36 30.419C40.3402 29.0449 39.9382 27.7034 39.199 26.545C38.4448 25.5953 37.9679 24.4557 37.821 23.252C37.8029 22.6078 38.0412 21.9828 38.4835 21.5141C38.9257 21.0454 39.5359 20.7713 40.18 20.752C40.242 20.752 40.301 20.76 40.362 20.763C38.8617 19.3896 37.0811 18.3584 35.1432 17.7408C33.2054 17.1231 31.1564 16.9337 29.1382 17.1856C27.1199 17.4375 25.1804 18.1247 23.4538 19.1998C21.7272 20.2748 20.2546 21.712 19.138 23.412C19.468 23.422 19.778 23.429 20.038 23.429C21.507 23.429 23.782 23.251 23.782 23.251C23.9354 23.239 24.0873 23.2885 24.2042 23.3886C24.3212 23.4886 24.3935 23.631 24.4055 23.7845C24.4174 23.9379 24.3679 24.0898 24.2679 24.2067C24.1678 24.3236 24.0254 24.396 23.872 24.408C23.872 24.408 23.111 24.498 22.264 24.542L27.38 39.759L30.454 30.538L28.265 24.538C27.508 24.494 26.792 24.404 26.792 24.404C26.6487 24.3799 26.5197 24.303 26.4305 24.1885C26.3412 24.0739 26.2981 23.93 26.3098 23.7853C26.3215 23.6405 26.3871 23.5054 26.4936 23.4066C26.6001 23.3079 26.7397 23.2527 26.885 23.252C26.885 23.252 29.205 23.43 30.585 23.43C32.054 23.43 34.329 23.252 34.329 23.252C34.4824 23.24 34.6343 23.2895 34.7512 23.3896C34.8682 23.4896 34.9405 23.632 34.9525 23.7855C34.9644 23.9389 34.9149 24.0908 34.8149 24.2077C34.7148 24.3246 34.5724 24.397 34.419 24.409C34.419 24.409 33.656 24.499 32.811 24.543L37.888 39.643L39.288 34.96C39.852 33.5028 40.2121 31.9747 40.358 30.419H40.36ZM31.122 32.352L26.907 44.605C29.7372 45.4383 32.7578 45.36 35.541 44.381C35.502 44.3194 35.4685 44.2544 35.441 44.187L31.122 32.352ZM43.199 24.388C43.2646 24.8665 43.298 25.3489 43.299 25.832C43.2751 27.5629 42.9122 29.2725 42.231 30.864L37.938 43.272C41.1024 41.4302 43.423 38.426 44.4056 34.899C45.3882 31.3719 44.9553 27.6006 43.199 24.388ZM30.876 14.752C27.6372 14.7522 24.4711 15.7128 21.7782 17.5123C19.0854 19.3118 16.9866 21.8695 15.7472 24.8618C14.5079 27.8542 14.1838 31.1468 14.8158 34.3234C15.4478 37.4999 17.0075 40.4178 19.2978 42.7079C21.588 44.998 24.5059 46.5576 27.6826 47.1894C30.8592 47.8212 34.1518 47.4968 37.144 46.2573C40.1363 45.0178 42.6938 42.9189 44.4932 40.2259C46.2926 37.5329 47.253 34.3668 47.253 31.128C47.248 26.7861 45.5209 22.6236 42.4507 19.5536C39.3804 16.4835 35.2178 14.7567 30.876 14.752ZM30.876 46.752C27.7852 46.7525 24.7637 45.8366 22.1936 44.1198C19.6235 42.4031 17.6202 39.9627 16.4371 37.1074C15.254 34.252 14.9443 31.11 15.547 28.0786C16.1498 25.0472 17.638 22.2626 19.8234 20.0771C22.0088 17.8915 24.7933 16.4031 27.8246 15.8002C30.856 15.1972 33.9981 15.5068 36.8535 16.6897C39.7089 17.8726 42.1494 19.8757 43.8663 22.4458C45.5832 25.0158 46.4994 28.0372 46.499 31.128C46.4937 35.2699 44.846 39.2407 41.9173 42.1696C38.9886 45.0985 35.0179 46.7464 30.876 46.752Z" fill="#317296"/> </g> <defs> <clipPath id="clip0_4_2"> <rect width="61.57" height="61.144" fill="white"/> </clipPath> </defs> </svg>-->
<!--</a>-->

<script src="./assets/vendors/jquery.min.js"></script>
<script src="./assets/vendors/jquery-ui/jquery-ui.min.js"></script>
<script src="./assets/vendors/bootstrap/js/bootstrap.min.js"></script>
<script src="./assets/vendors/gsap/minified/gsap.min.js"></script>
<script src="./assets/vendors/gsap/utils/SplitText.min.js"></script>
<script src="./assets/vendors/gsap/minified/ScrollTrigger.min.js"></script>
<script src="./assets/vendors/fastdom/fastdom.min.js"></script>
<script src="./assets/vendors/isotope/isotope.pkgd.min.js"></script>
<script src="./assets/vendors/isotope/packery-mode.pkgd.min.js"></script>
<script src="./assets/vendors/flickity/flickity.pkgd.min.js"></script>
<script src="./assets/vendors/imagesloaded.pkgd.min.js"></script>
<script src="./assets/vendors/draggabilly.pkgd.min.js"></script>
<script src="./assets/vendors/fontfaceobserver.js"></script>
<script src="./assets/vendors/particles.min.js"></script>
<script src="./assets/vendors/lity/lity.min.js"></script>
<script src="./assets/vendors/lottie/lottie.min.js"></script>
<script src="./assets/vendors/section-flow/liquidSectionFlow.min.js"></script>
<script src="./assets/vendors/matter/matter.min.js"></script>
<script src="./assets/vendors/throwable/liquidThrowable.min.js"></script>
<script src="./assets/vendors/gsap/minified/DrawSVGPlugin.min.js"></script>
<script src="./assets/vendors/draw-shape/liquidDrawShape.min.js"></script>
<script src="./assets/js/liquid-gdpr.min.js"></script>
<script src="./assets/js/theme.min.js"></script>
<script src="./assets/js/liquid-ajax-contact-form.min.js"></script>
<script src="./assets/js/demo/start-hub-8.js"></script>

<!-- Start custom cursor -->
<div class="lqd-cc lqd-cc--inner fixed pointer-events-none"></div>
<div class="lqd-cc--el lqd-cc-solid lqd-cc-explore flex items-center justify-center rounded-full fixed pointer-events-none">
    <div class="lqd-cc-solid-bg flex absolute lqd-overlay"></div>
    <div class="lqd-cc-solid-txt flex justify-center text-center relative">
        <div class="lqd-cc-solid-txt-inner">Explide</div>
    </div>
</div>
<div class="lqd-cc--el lqd-cc-solid lqd-cc-drag flex items-center justify-center rounded-full fixed pointer-events-none">
    <div class="lqd-cc-solid-bg flex absolute lqd-overlay"></div>
    <div class="lqd-cc-solid-ext lqd-cc-solid-ext-left inline-flex items-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" style="width: 1em; height: 1em;">
            <path fill="currentColor" d="M19.943 6.07L9.837 14.73a1.486 1.486 0 0 0 0 2.25l10.106 8.661c.96.826 2.457.145 2.447-1.125V7.195c0-1.27-1.487-1.951-2.447-1.125z"></path>
        </svg>
    </div>
    <div class="lqd-cc-solid-txt flex justify-center text-center relative">
        <div class="lqd-cc-solid-txt-inner">Drag</div>
    </div>
    <div class="lqd-cc-solid-ext lqd-cc-solid-ext-right inline-flex items-center">
        <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" style="width: 1em; height: 1em;">
            <path fill="currentColor" d="M11.768 25.641l10.106-8.66a1.486 1.486 0 0 0 0-2.25L11.768 6.07c-.96-.826-2.457-.145-2.447 1.125v17.321c0 1.27 1.487 1.951 2.447 1.125z"></path>
        </svg>
    </div>
</div>
<div class="lqd-cc--el lqd-cc-arrow inline-flex items-center fixed top-0 left-0 pointer-events-none">
    <svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
        <path d="M60.4993 0V4.77005H8.87285L80 75.9207L75.7886 79.1419L4.98796 8.35478V60.4993H0V0H60.4993Z" />
    </svg>
</div>
<div class="lqd-cc--el lqd-cc-custom-icon rounded-full fixed pointer-events-none">
    <div class="lqd-cc-ci inline-flex items-center justify-center rounded-full relative">
        <svg width="32" height="32" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" style="width: 1em; height: 1em;">
            <path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M16.03 6a1 1 0 0 1 1 1v8.02h8.02a1 1 0 1 1 0 2.01h-8.02v8.02a1 1 0 1 1-2.01 0v-8.02h-8.02a1 1 0 1 1 0-2.01h8.02v-8.01a1 1 0 0 1 1.01-1.01z"></path>
        </svg>
    </div>
</div>
<div class="lqd-cc lqd-cc--outer fixed top-0 left-0 pointer-events-none"></div>
<!-- End custom cursor -->

<template id="lqd-snickersbar">
    <div class="lqd-snickersbar flex flex-wrap lqd-snickersbar-in" data-item-id>
        <div class="lqd-snickersbar-inner flex flex-wrap items-center">
            <div class="lqd-snickersbar-detail">
                <p class="hidden lqd-snickersbar-addding-temp my-0">Adding {{itemName}} to cart</p>
                <p class="hidden lqd-snickersbar-added-temp my-0">Added {{itemName}} to cart</p>
                <p class="my-0 lqd-snickersbar-msg flex items-center my-0"></p>
                <p class="my-0 lqd-snickersbar-msg-done flex items-center my-0"></p>
            </div>
            <div class="lqd-snickersbar-ext ml-4"></div>
        </div>
    </div>
</template>
<template id="lqd-temp-sticky-header-sentinel">
    <div class="lqd-sticky-sentinel invisible absolute pointer-events-none"></div>
</template>
<div class="lity" role="dialog" aria-label="Dialog Window (Press escape to close)" tabindex="-1" data-modal-type="default">
    <div class="lity-wrap" data-lity-close role="document">
        <div class="lity-loader" aria-hidden="true">Loading...</div>
        <div class="lity-container">
            <div class="lity-content"></div>
        </div>
        <button class="lity-close" type="button" aria-label="Close (Press escape to close)" data-lity-close>&times;</button>
    </div>
</div>
</body>

</html>