1843 lines
161 KiB
PHP
1843 lines
161 KiB
PHP
<!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="https://x.com/Tokslaw1" 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>
|
||
</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="/" rel="home">
|
||
<span class="navbar-brand-inner post-rel">
|
||
<img src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Tokslaw">
|
||
</span>
|
||
<span class="link-badge text-badge">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="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/about'; ?>" class="py-15 pr-60">About Me</a>
|
||
</li>
|
||
<li>
|
||
<a href="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/portfolio'; ?>">Portfolio</a>
|
||
|
||
</li>
|
||
<li>
|
||
<a href="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/services'; ?>" class="py-15 pr-60">Services</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="#contact-modal" 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="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/'; ?>">
|
||
<span class="navbar-brand-inner">
|
||
<img class="logo-default" src="./assets/images/demo/start-hub-8/tokslaw-logo-.svg" alt="Tokslaw">
|
||
</span>
|
||
<span class="link-badge text-badge">Tokslaw</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="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/services'; ?>" class="py-15 pr-60">Services</a>
|
||
</li>
|
||
<li>
|
||
<a href="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/portfolio'; ?>" class="py-15 pr-60">Projects</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">Portfolio</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 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/Connect-Family.png" title="img-3" alt="img-3" 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 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/SoftwareDesign.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 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">★</i>
|
||
<i class="star-full">★</i>
|
||
<i class="star-full">★</i>
|
||
<i class="star-full">★</i>
|
||
<i class="star-full">★</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>
|
||
</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="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/portfolio'; ?>">Portfolio</a>
|
||
</li>
|
||
|
||
<li>
|
||
<a href="<?= $_SERVER['REQUEST_SCHEME'] . '://' . $_SERVER['HTTP_HOST'] . '/about'; ?>">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="https://www.linkedin.com/in/toks-lawal/">
|
||
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>
|
||
<span class="link-badge text-badge">Tokslaw</span>
|
||
</div>
|
||
</div>
|
||
<div class="ld-fancy-heading relative">
|
||
<p class="ld-fh-element relative m-0 text-14 text-white-60">© 2025 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 hover:svg-black" target="_blank">
|
||
<span class="sr-only">GitHub</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="https://www.instagram.com/tokslawdev/" 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="https://www.linkedin.com/in/toks-lawal/" class="icon social-icon social-icon-spotify" target="_blank">
|
||
<span class="sr-only">LinkedIn</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="https://www.facebook.com/tokunbo.lawal.1485" 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="https://x.com/Tokslaw1" 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="https://blog.tokslaw.com" class="icon social-icon social-icon-LinkedIn" target="_blank">
|
||
<span class="sr-only">Blog</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 -->
|
||
|
||
|
||
|
||
<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>×</button>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
|
||
</html>
|