Files
OluAmeyeMain/app/Views/view_home.php
T
CHIEFSOFT\ameye 3071edd8f3 Fix Areas
2024-10-04 21:02:48 -04:00

1504 lines
114 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="Olusesan Ameye, Ameye Olusesan">
<meta name="author" content="LiquidThemes">
<meta name="description" content="Olusesan Ameye, Ameye Olusesan.">
<meta property="og:title" content="Olusesan Ameyte">
<meta property="og:description" content="Hub is a HTML template with high performance, and award-winning design collection.">
<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/demo/asymmetric-9.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&family=Playfair+Display&family=IBM+Plex+Sans:wght@500;600;700&family=Space+Grotesk:wght@400;700&display=swap" rel="stylesheet">
<title>Olusesan Ameye - Enterprise & Innovation</title>
</head>
<body class="lqd-cc-outer-hidden" 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-mobile-header-builder="true" 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 sticky-header-noshadow" data-sticky-header="true" data-sticky-values-measured="false" data-sticky-options='{"disableOnMobile": true, "dynamicColors": true}'>
<div class="lqd-head-sec-wrap w-full pt-20 px-75 module-header">
<div class="flex items-center justify-between rounded-4 shadow-black-15 px-25 bg-white m-0">
<div class="w-30percent flex items-center p-0 sm:w-50percent">
<div class="module-logo flex navbar-brand-plain py-15">
<a class="navbar-brand flex p-0 relative" href="#" rel="home">
<span class="navbar-brand-inner post-rel" style="font-weight: bolder; font-size: 20px; color: #0A2C4E;">
Olu Ameye
<!-- <img class="logo-default" src="./assets/images/demo/asymmetric-9/logo/logo.svg" alt="Asymmetric nine">-->
</span>
</a>
</div>
</div>
<div class="flex justify-center lg:hidden p-0">
<div class="module-primary-nav flex">
<nav class="navbar-collapse lqd-submenu-default-style inline-flex p-0 text-14 font-medium" aria-expanded="false">
<ul class="main-nav main-nav-hover-fade-inactive link-black flex reset-ul justify-center" itemtype="http://schema.org/SiteNavigationElement" itemscope="itemscope" data-submenu-options='{"toggleType": "fade", "handler": "mouse-in-out"}' data-localscroll="true" data-localscroll-options='{"itemsSelector":">li > a", "offset": 85}'>
<li>
<a href="#banner">
Home
</a>
</li>
<li>
<a href="#our-services">
About Me
<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="#case-studies">
Works
<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="#testimonials">
Blog
<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">
Contact
<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>
</ul>
</nav>
</div>
</div>
<div class="w-30percent flex items-center justify-end p-0 sm:w-50percent" data-custom-animations="true" data-ca-options='{" animationTarget": ".animation-element", "duration" :600, "ease": "back.out", "initValues": {"x": "100px", "opacity" : 0} , "animations": {"x": "0px", "opacity" : 1}}'>
<div class="flex justify-end items-center sm:hidden">
<a href="#contact-modal" class="button btn text-14 font-bold uppercase leading-1em tracking-1 text-black border-2 rounded-100 whitespace-nowrap py-0/6em px-1em mr-10 z-1 text-14 hover:bg-black hover:text-white animation-element" data-lity="#contact-modal">
<span class="btn-txt" data-text="Send a message">Send a message</span>
</a>
<a href="#contact-modal" class="button btn btn-solid btn-custom-size btn-icon-block btn-icon-top tracking-1 text-black rounded-full whitespace-nowrap z-1 bg-accent border-none p-0 w-30 h-30 sm:hidden animation-element" data-lity="#contact-modal">
<span class="btn-icon w-1em">
<svg xmlns="http://www.w3.org/2000/svg" width="10.625" height="10.625" viewBox="0 0 10.625 10.625">
<path d="M-1.76-11.322H5.313V-4.25H3.885V-8.932L-4.316-.7l-1-1,8.2-8.234H-1.76Z" transform="translate(5.313 11.322)"></path>
</svg>
</span>
</a>
</div>
<div class="hidden ml-15 lg:block">
<div class="ld-module-sd ld-module-sd-hover ld-module-sd-left module-mobile-nav">
<button class="nav-trigger style-6 txt-left collapsed text-13 font-normal tracking-0 capitalize bg-transparent p-0 border-none flex relative items-center justify-center" type="button" data-ld-toggle="true" data-bs-toggle-options='{"cloneTriggerInTarget": false, "type": "click"}' data-bs-toggle="collapse" data-bs-target="#lqd-drawer-main-navigation" aria-expanded="false" aria-controls="lqd-drawer-main-navigation">
<span class="bars inline-block relative z-1">
<span class="bars-inner flex flex-col w-full h-full">
<span class="bar inline-block relative"></span>
<span class="bar inline-block relative"></span>
<span class="bar inline-block relative"></span>
</span>
</span>
<span class="text-black text-capital txt inline-block">Menu</span>
</button>
<div class="ld-module-dropdown collapse absolute" id="lqd-drawer-main-navigation">
<div class="ld-sd-wrap padding-unset">
<div class="ld-sd-inner">
<div class="flex flex-row pt-100 pb-50 px-50 sm:flex-col sm:justify-between module-col-inner">
<div class="w-30percent relative flex flex-col justify-between sm:w-full">
<div class="relative flex flex-col module-social">
<div class="pb-35 ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 m-0 text-black-30 inline-block relative">Social</h2>
</div>
<div class="lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none lqd-magnetic-items">
<ul class="reset-ul">
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Facebook
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Behance
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Dribble
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Instagram
</a>
</li>
<li>
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Youtube
</a>
</li>
</ul>
</div>
</div>
<div class="relative flex flex-col">
<div class="w-full ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 m-0 text-black-30 inline-block relative">Get in touch</h2>
</div>
<div class="max-w-full ld-fancy-heading relative">
<div class="ld-fh-element mb-0/5em inline-block relative text-20 leading-1em sm:text-16">
<span class="text-black">info@liquid.com</span>
</div>
</div>
</div>
</div>
<div class="flex flex-col sm:order-first">
<div class="pb-30 ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 text-black-30 inline-block relative">Menu</h2>
</div>
<div class="module-primary-nav flex">
<div class="navbar-collapse inline-flex p-0 lqd-submenu-default-style lqd-magnetic-items" aria-expanded="false" role="navigation">
<ul class="link-black main-nav flex reset-ul lqd-menu-counter-right lqd-menu-items-block main-nav-hover-fade-inactive" data-submenu-options='{"toggleType": "slide", "handler": "click"}'>
<li>
<a class="text-38" href="#banner">Home</a>
</li>
<li>
<a class="text-38" href="#our-services">
<span>About Me</span>
<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 class="text-38" href="#case-studies">
<span>Works</span>
<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 class="text-38" href="#testimonials">
<span>Blog</span>
<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 class="text-38" href="#contact">
<span>Contact</span>
<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>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="lqd-module-backdrop"></div>
</div>
</div>
</div>
</div>
</div>
<div class="lqd-stickybar-wrap lqd-stickybar-left flex-col items-center justify-between">
<div class="flex items-center">
<div class="ld-module-sd ld-module-sd-hover ld-module-sd-left flex-grow-1 items-start">
<button class="nav-trigger style-6 txt-left collapsed text-13 font-normal p-0 flex relative items-center justify-center" type="button" data-lqd-interactive-color="true" data-ld-toggle="true" data-bs-toggle-options='{"cloneTriggerInTarget": false, "type": "click"}' data-bs-toggle="collapse" data-bs-target="#lqd-drawer-stickybar-left" aria-expanded="false" aria-controls="lqd-drawer-stickybar-left">
<span class="bars inline-block relative z-1">
<span class="bars-inner flex flex-col w-full h-full">
<span class="bar inline-block relative"></span>
<span class="bar inline-block relative"></span>
<span class="bar inline-block relative"></span>
</span>
</span>
<span class="txt inline-block">Menu</span>
</button>
<div class="ld-module-dropdown collapse absolute lqd-drawer-stickybar-left w-880" id="lqd-drawer-stickybar-left">
<div class="ld-sd-wrap">
<div class="w-full min-h-100vh flex flex-row justify-start items-stretch py-100 px-135 module-left-side">
<div class="w-30percent flex flex-col justify-between">
<div class="flex flex-col">
<div class="pb-35 ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 m-0 text-black-30 inline-block relative">Social</h2>
</div>
<div class="lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none lqd-magnetic-items">
<ul class="reset-ul">
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
<span>Facebook</span>
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
<span>Behance</span>
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
<span>Dribble</span>
</a>
</li>
<li class="mb-25">
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
<span>Instagram</span>
</a>
</li>
<li>
<a class="text-16 text-black" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
<span>Youtube</span>
</a>
</li>
</ul>
</div>
</div>
<div class="flex flex-col">
<div class="ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 m-0 text-black-30 inline-block relative">Get in touch</h2>
</div>
<div class="ld-fancy-heading relative">
<div class="ld-fh-element mb-0/5em inline-block relative text-20 leading-1em">
<span class="text-black">contact@oluameye.com</span>
</div>
</div>
</div>
</div>
<div class="flex flex-col sm:order-first">
<div class="pb-30 ld-fancy-heading relative">
<h2 class="ld-fh-element text-16 text-black-30 inline-block relative">Menu</h2>
</div>
<div class="module-primary-nav flex">
<div class="navbar-collapse inline-flex p-0 lqd-submenu-default-style lqd-magnetic-items" aria-expanded="false" role="navigation">
<ul class="link-black main-nav flex reset-ul lqd-menu-counter-right lqd-menu-items-block main-nav-hover-fade-inactive" data-submenu-options='{"toggleType": "slide", "handler": "click"}' data-localscroll="true" data-localscroll-options='{"itemsSelector":">li > a", "offset": 85}'>
<li>
<a class="text-38" href="#banner">
Home
</a>
</li>
<li>
<a class="text-38" href="#our-services">
About Me
<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 class="text-38" href="#case-studies">
Works
<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 class="text-38" href="#testimonials">
Blog
<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 class="text-38" href="#contact">
Contact
<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>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="lqd-module-backdrop"></div>
</div>
</div>
<div class="flex items-center pt-40">
<div class="flex items-center -rotate-180 z-100 vertical-lr">
<p class="text-14 text-black" data-lqd-interactive-color="true">contact@oluameye.com</p>
</div>
</div>
<div class="flex items-center">
<div class="-rotate-180 z-100 flex-grow-1">
<div class="lqd-scrl-indc lqd-scrl-indc-style-dot mx-auto flex whitespace-nowrap align-self-end" data-lqd-scroll-indicator="true">
<a href="#wrap" class="text-black" data-localscroll="true" data-lqd-interactive-color="true">
<span class="lqd-scrl-indc-inner flex items-center">
<span class="lqd-scrl-indc-txt">Scroll to top</span>
<span class="lqd-scrl-indc-line flex-grow-1 relative">
<span class="lqd-scrl-indc-el inline-block absolute rounded-4"></span>
</span>
</span>
</a>
</div>
</div>
</div>
</div>
<div class="lqd-stickybar-wrap lqd-stickybar-right items-center justify-center">
<div class="-rotate-180 vertical-lr">
<a href="#contact-modal" class="button text-black text-14" data-lity="#contact-modal" data-lqd-interactive-color="true">
Send a message
</a>
</div>
</div>
</header>
<main class="content bg-white" id="lqd-site-content">
<div id="lqd-contents-wrap">
<!-- Start Banner -->
<section class="lqd-section banner pt-20 px-75" id="banner">
<div class="container-fluid">
<div class="lqd-vslider">
<div class="rounded-6 lqd-vslider-scrn w-full relative overflow-hidden" data-lqd-slideshow="true" data-inview="true">
<span class="lqd-vslider-loader inline-flex items-center justify-center absolute z-3">
<span class="inline-flex rounded-full"></span>
</span>
<div class="lqd-vslider-scrn-inner relative overflow-hidden h-full">
<div class="lqd-vslider-ext lqd-overlay flex relative z-2 h-auto">
<ul class="w-full link-18 link-font-normal link-white reset-ul">
<li class="pt-1rem pr-1rem pl-1rem m-0 absolute is-active">
<div class="flex flex-col pr-40percent items-start sm:pr-0">
<h2 class="mb-0/5em leading-1em text-white">A valuable solution to design needs is to understand the foundational problem.</h2>
<!-- <a href="https://www.youtube.com/watch?v=WaSvMAl4zPw" class="fresco btn btn-naked btn-icon-left btn-icon-circle btn-icon-custom-size btn-icon-bordered btn-icon-border-thicker text-14 font-normal uppercase leading-1em tracking-0 text-black leading-20 tracking-0 capitalize hover:text-white hover:inner-text-black hover:inner-bg-white">-->
<!-- <span class="btn-txt">-->
<!-- <small>Click to Watch</small> See how it works </span>-->
<!-- <span class="btn-icon w-60 h-60 text-white border-1 border-white-40 rounded-full mr-20 inner-text-black inner-bg-white">-->
<!-- <i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-play"></i>-->
<!-- </span>-->
<!-- </a>-->
</div>
</li>
<li class="pt-1rem pr-1rem pl-1rem m-0 absolute">
<div class="flex flex-col pr-40percent items-start sm:pr-0">
<h2 class="mb-0/5em leading-1em text-white">Reasonable effort step matching to implement a solution target.</h2>
<!-- <a href="https://www.youtube.com/watch?v=WaSvMAl4zPw" class="fresco btn btn-naked btn-icon-left btn-icon-circle btn-icon-custom-size btn-icon-bordered btn-icon-border-thicker text-14 font-normal uppercase leading-1em tracking-0 text-black leading-20 tracking-0 capitalize hover:text-white hover:inner-text-black hover:inner-bg-white">-->
<!-- <span class="btn-txt">-->
<!-- <small>Click to Watch</small> See how it works </span>-->
<!-- <span class="btn-icon w-60 h-60 text-white border-1 border-white-40 rounded-full mr-20 inner-text-black inner-bg-white">-->
<!-- <i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-play"></i>-->
<!-- </span>-->
<!-- </a>-->
</div>
</li>
<li class="pt-1rem pr-1rem pl-1rem m-0 absolute">
<div class="flex flex-col pr-40percent items-start sm:pr-0">
<h2 class="mb-0/5em leading-1em text-white">Constantly modernizing the use case of solution as terrain evolves continuously.</h2>
<!-- <a href="https://www.youtube.com/watch?v=WaSvMAl4zPw" class="fresco btn btn-naked btn-icon-left btn-icon-circle btn-icon-custom-size btn-icon-bordered btn-icon-border-thicker text-14 font-normal uppercase leading-1em tracking-0 text-black leading-20 tracking-0 capitalize hover:text-white hover:inner-text-black hover:inner-bg-white">-->
<!-- <span class="btn-txt">-->
<!-- <small>Click to Watch</small> See how it works </span>-->
<!-- <span class="btn-icon w-60 h-60 text-white border-1 border-white-40 rounded-full mr-20 inner-text-black inner-bg-white">-->
<!-- <i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-play"></i>-->
<!-- </span>-->
<!-- </a>-->
</div>
</li>
<li class="pt-1rem pr-1rem pl-1rem m-0 absolute">
<div class="flex flex-col pr-40percent items-start sm:pr-0">
<h2 class="mb-0/5em leading-1em text-white">From car dashboards to virtual assistant technology wearable devices, platforms are everywhere.</h2>
<!-- <a href="https://www.youtube.com/watch?v=WaSvMAl4zPw" class="fresco btn btn-naked btn-icon-left btn-icon-circle btn-icon-custom-size btn-icon-bordered btn-icon-border-thicker text-14 font-normal uppercase leading-1em tracking-0 text-black leading-20 tracking-0 capitalize hover:text-white hover:inner-text-black hover:inner-bg-white">-->
<!-- <span class="btn-txt">-->
<!-- <small>Click to Watch</small> See how it works </span>-->
<!-- <span class="btn-icon w-60 h-60 text-white border-1 border-white-40 rounded-full mr-20 inner-text-black inner-bg-white">-->
<!-- <i aria-hidden="true" class="lqd-icn-ess icon-ion-ios-play"></i>-->
<!-- </span>-->
<!-- </a>-->
</div>
</li>
</ul>
</div>
<div class="lqd-vslider-images lqd-overlay flex z-0">
<figure class="absolute overflow-hidden is-active">
<img class="w-full h-full lqd-overlay flex objfit-cover objfit-center" src="./assets/images/banners/blog-cover-1@2x.jpeg" alt="banner">
</figure>
<figure class="absolute overflow-hidden">
<img class="w-full h-full lqd-overlay flex objfit-cover objfit-center" src="./assets/images/banners/bg0.jpg" alt="banner">
</figure>
<figure class="absolute overflow-hidden">
<img class="w-full h-full lqd-overlay flex objfit-cover objfit-center" src="./assets/images/banners/bg3.jpg" alt="banner">
</figure>
<figure class="absolute overflow-hidden">
<img class="w-full h-full lqd-overlay flex objfit-cover objfit-center" src="./assets/images/banners/bg2.jpg" alt="banner">
</figure>
</div>
<div class="lqd-vslider-menu lqd-overlay flex z-1">
<ul class="reset-ul flex flex-col lqd-overlay flex text-vertical">
<li class="flex items-end p-1/5rem m-0 relative is-active">
<a class="lqd-webgl-slideshow-link p-1/5rem" href="#">
<span class="inline-flex">Product Design</span>
</a>
</li>
<li class="flex items-end p-1/5rem m-0 relative">
<a class="lqd-webgl-slideshow-link p-1/5rem" href="#">
<span class="inline-flex">Implementation Strategy</span>
</a>
</li>
<li class="flex items-end p-1/5rem m-0 relative">
<a class="lqd-webgl-slideshow-link p-1/5rem" href="#">
<span class="inline-flex">A.I & Mobility</span>
</a>
</li>
<li class="flex items-end p-1/5rem m-0 relative">
<a class="lqd-webgl-slideshow-link p-1/5rem" href="#">
<span class="inline-flex">Any Platform</span>
</a>
</li>
</ul>
</div>
</div>
<span class="lqd-extra-cursor fixed pointer-events-none"></span>
</div>
</div>
</div>
</section>
<!-- End Banner -->
<!-- Start Clients -->
<section class="lqd-section clients bg-white py-60" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "ease": "back.inOut", "direction": "random", "initValues": {"opacity" : 0} , "animations": {"opacity" : 1}}'>
<div class="container">
<div class="row items-center">
<div class="col col-12">
<div class="ld-fancy-heading relative animation-element">
<h6 class="ld-fh-element mb-2em inline-block relative"><hr style="color: lightgrey; font-size: 2px;" /></h6>
</div>
</div>
</div>
</div>
</section>
<!-- End Clients -->
<!-- Start Our Services -->
<section class="lqd-section our-services py-10" id="our-services">
<div class="container">
<div class="row">
<div class="w-45percent relative flex justify-between sm:w-full module-col">
<div class="relative w-190 module-img-1">
<div class="mt-55 lqd-imggrp-single block relative" data-shadow-style="2" data-animate-shadow="true" data-inview="true" data-inview-options='{"delayTime" :200}'>
<div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
<figure class="w-full relative rounded-2">
<img class="rounded-2" width="281" height="297" src="./assets/images/ab1.jpg" alt="what we do">
</figure>
</div>
</div>
</div>
<div class="relative w-230 module-img-2">
<div class="lqd-imggrp-single block relative" data-shadow-style="4" data-animate-shadow="true" data-inview="true" data-inview-options='{"delayTime" :300}'>
<div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
<figure class="w-full relative rounded-2">
<img class="rounded-2" width="347" height="446" src="./assets/images/ab3.jpg" alt="what we do">
</figure>
</div>
</div>
</div>
<div class="absolute top-45percent max-w-full z-1 module-img-3">
<div class="lqd-imggrp-single block relative" data-shadow-style="1" data-animate-shadow="true" data-inview="true">
<div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
<figure class="w-full relative rounded-2">
<img class="rounded-2" width="222" height="426" src="./assets/images/ab2.jpg" alt="what we do">
</figure>
</div>
</div>
</div>
</div>
<div class="w-55percent pl-10percent sm:w-full sm:p-0" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "ease": "back.out", "initValues": {"x": "30px", "rotationY" :30, "opacity" : 0} , "animations": {"x": "0px", "rotationY" :0, "opacity" : 1}}'>
<div class="flex justify-start items-center">
<a href="#contact-modal" class="button btn text-14 font-bold uppercase leading-1em tracking-1 text-black border-2 rounded-100 whitespace-nowrap py-0/6em px-1em mr-10 hover:bg-black hover:text-white animation-element" data-lity="#contact-modal">
<span class="btn-txt" data-text="Send a message">Send a message</span>
</a>
<a href="#contact-modal" class="button btn btn-solid btn-custom-size btn-icon-block btn-icon-top w-35 h-35 bg-accent mr-10 text-black rounded-full animation-element" data-lity="#contact-modal">
<span class="btn-icon w-1em">
<svg xmlns="http://www.w3.org/2000/svg" width="10.625" height="10.625" viewBox="0 0 10.625 10.625">
<path d="M-1.76-11.322H5.313V-4.25H3.885V-8.932L-4.316-.7l-1-1,8.2-8.234H-1.76Z" transform="translate(5.313 11.322)"></path>
</svg>
</span>
</a>
</div>
<div class="ld-fancy-heading relative animation-element">
<h3 class="ld-fh-element text-30 leading-1/2em mt-0/75em mb-1em inline-block relative">Always passionate about ideas to implementation and beyond.</h3>
</div>
<div class="ld-fancy-heading relative animation-element">
<h6 class="ld-fh-element text-16 mb-1em inline-block relative">I am an engineer by heart and passionate about bringing ideas from abstract to life. My experience spans e-commerce, individual and ambulatory healthcare designs, fintech, and mobility. </h6>
</div>
<div class="ld-fancy-heading relative animation-element">
<h6 class="ld-fh-element text-16 mb-1em inline-block relative">I am an engineer by heart and passionate about bringing ideas from abstract to life. My experience spans e-commerce, individual and ambulatory healthcare designs, fintech, and mobility. </h6>
</div>
</div>
</div>
</div>
</section>
<!-- End Our Services -->
<!-- Start Solutions -->
<section class="lqd-section solutions pt-160 pb-80" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "ease": "back.out", "initValues": {"y": "50px", "z": "50px", "rotationY" :20, "opacity" : 0} , "animations": {"y": "0px", "z": "0px", "rotationY" :0, "opacity" : 1}}'>
<div class="container">
<div class="row">
<div class="col col-12 col-xl-3">
<div class="flex flex-col items-start module-title">
<!-- <div class="w-auto py-5 px-10 rounded-4 bg-gray text-center ld-fancy-heading relative animation-element">-->
<!-- <h6 class="ld-fh-element text-10 font-bold uppercase tracking-1 m-0 inline-block relative"></h6>-->
<!-- </div>-->
<div class="ld-fancy-heading relative module-title animation-element">
<h2 class="ld-fh-element text-32 mt-1em mb-0/5em inline-block relative">Product lifecycle managed.</h2>
</div>
</div>
</div>
<div class="col col-12 col-xl-9">
<div class="flex gap-60 sm:flex-wrap module-box">
<div class="w-full flex flex-col">
<div class="ld-fancy-heading relative animation-element">
<h2 class="ld-fh-element text-15 tracking-0 mb-1/25em inline-block relative">
<span class="text-24 pr-10">01</span>
<span class="font-normal pr-5">/</span>
<span>Design</span>
</h2>
</div>
<div class="ld-fancy-heading relative animation-element">
<p class="ld-fh-element mb-0/5em inline-block relative text-13 leading-16">
Design starts with the concept of the product at any level, understanding the known objectives, and pivoting opportunities to find a midway in a continuously evolving landscape.</p>
</div>
</div>
<div class="w-full flex flex-col">
<div class="ld-fancy-heading relative animation-element">
<h2 class="ld-fh-element text-15 tracking-0 mb-1/25em inline-block relative">
<span class="text-24 pr-10">02</span>
<span class="font-normal pr-5">/</span>
<span>Implementation</span>
</h2>
</div>
<div class="ld-fancy-heading relative animation-element">
<p class="ld-fh-element mb-0/5em inline-block relative text-13 leading-16">
Step by step and iteration to land a product requires experience and spatial knowledge beyond the direct line of objectives.
</p>
</div>
</div>
<div class="w-full flex flex-col">
<div class="ld-fancy-heading relative animation-element">
<h2 class="ld-fh-element text-15 tracking-0 mb-1/25em inline-block relative">
<span class="text-24 pr-10">03</span>
<span class="font-normal pr-5">/</span>
<span>Modern</span>
</h2>
</div>
<div class="ld-fancy-heading relative animation-element">
<p class="ld-fh-element mb-0/5em inline-block relative text-13 leading-16">
Combining successful delivery of user experiences with modern solutions. Direct or systematics upgrades to target.
</p>
</div>
</div>
<div class="w-full flex flex-col">
<div class="ld-fancy-heading relative animation-element">
<h2 class="ld-fh-element text-15 tracking-0 mb-1/25em inline-block relative">
<span class="text-24 pr-10">04</span>
<span class="font-normal pr-5">/</span>
<span>Operations</span>
</h2>
</div>
<div class="ld-fancy-heading relative animation-element">
<p class="ld-fh-element mb-0/5em inline-block relative text-13 leading-16">
Innovative support tools and environment to scale and manage products manually, automated, or with artificial intelligence.
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Solutions -->
<!-- Start Section Dark -->
<section class="lqd-section section-dark max-w-full bg-dark px-75 pb-80">
<!-- Start Our Vision -->
<section class="lqd-section our-vision pt-80 min-h-70vh">
<div class="absolute w-full max-w-full bottom-0 pointer-events-none">
<div class="lqd-throwable-scene relative pointer-events-none overflow-hidden" data-lqd-throwable-scene="true" data-throwable-options='{"roundness": "7em"}'>
<p class="lqd-throwable-element inline-block absolute top-0 left-0 whitespace-nowrap m-0 pointer-events-auto user-select-none module-float-1" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Elementor Support</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-float-2" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Mobile Builder</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-float-3" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Next-gen Technologies</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-float-4" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">WooCommerce Builder</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-float-5" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Adaptive Colors</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-float-6" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Liquid Events</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-float-7" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Smart Assets Manager</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-float-8" data-lqd-throwable-el>
<span class="text-black py-0/25em px-1/5em text-22 leading-1/5em rounded-100 lqd-throwable-element-rot inline-block sm:text-16">Performance</span>
</p>
</div>
</div>
<div class="container">
<div class="row">
<div class="col col-12 mb-220">
<div class="mb-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="48" height="10" src="./assets/images/demo/asymmetric-9/shape/shape.svg" alt="shape">
</figure>
</div>
</div>
<h3 class="lqd-text-reveal-el mb-40 text-74 font-semibold leading-0/9em -tracking-3 text-white" data-split-text="true" data-split-options='{"type": "words, chars"}' data-parallax="true" data-parallax-options='{"parallaxTargets": ".lqd-chars, figure", "start": "top bottom", "end": "center 75%", "scrub" : 3}' data-parallax-from='{"opacity" :0.2}' data-parallax-to='{"opacity" :1, "stagger": {"from": "start", "each" : 1}}'>
<span class="lqd-adv-txt-item">
<span>Continuously understand how users respond to</span>
<span class="vertical-align-top mx-5 lqd-adv-txt-fig relative inline-flex">
<img class="h-auto max-w-full border-none rounded-0" width="62" height="62" src="./assets/images/demo/asymmetric-9/shape/Img-2.png" alt="shape">
</span>
</span>
<span class="lqd-adv-txt-item">
<span>products, functionality efficiency, and engagement </span>
<span class="vertical-align-top mx-5 lqd-adv-txt-fig relative inline-flex">
<img class="h-auto max-w-full border-none rounded-0" width="62" height="62" src="./assets/images/demo/asymmetric-9/shape/Img-1.png" alt="shape">
</span>
</span>
<span class="lqd-adv-txt-item">scores to deliver the best user experience.</span>
</h3>
<div class="flex justify-start items-center">
<div class="w-auto mr-10 py-5 border-2 border-white rounded-100 px-15 ld-fancy-heading relative">
<h5 class="ld-fh-element text-14 uppercase tracking-1 m-0 text-white inline-block relative">My vision</h5>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Our Vision -->
<!-- Start Case Studies -->
<section class="lqd-section case-studies bg-white rounded-10 mb-90" id="case-studies">
<div class="container-fluid border-bottom border-lightgray py-30">
<div class="container">
<div class="row">
<div class="col col-12 text-start">
<div class="ld-fancy-heading relative module-title">
<h2 class="ld-fh-element inline-block relative text-28 m-0">Recent Works</h2>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col col-12 pt-55 pb-25 module-col">
<div class="flex flex-wrap" data-custom-animations="true" data-ca-options='{"animationTarget": "h2", "ease": "bounce.in", "direction": "random", "initValues":{ "opacity": 0 }, "animations":{ "opacity": 1 }}'>
<h2 class="text-94 font-medium -tracking-1 mr-0/25em mb-0/2em sm:text-60">.discovery</h2>
<h2 class="text-94 font-medium -tracking-1 mr-0/25em mb-0/2em sm:text-60">.solution</h2>
<h2 class="text-94 font-medium -tracking-1 mr-0/25em mb-0/2em sm:text-60">.operation</h2>
<h2 class="text-94 font-medium font-accent italic -tracking-1 mr-0/25em mb-0/2em sm:text-60">.innovative</h2>
</div>
<div class="lqd-pf-grid mt-50">
<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="filter-list filter-list-inline items-centerd-lg-flex flex items-center md:hidden" id="pf-filter-case-studies">
<li class="active text-15" data-filter="*">
<span>All</span>
</li>
<li class="text-15" data-filter=".healthcare">
<span>HealthCare</span>
</li>
<li class="text-15" data-filter=".engineering">
<span>Engineering</span>
</li>
<li class="text-15" data-filter=".mobility">
<span>Mobility</span>
</li>
<li class="text-15" data-filter=".ecommerce">
<span>Ecommerce</span>
</li>
<li class="text-15" data-filter=".branding">
<span>Marketing</span>
</li>
</ul>
<div class="lqd-filter-dropdown hidden md:block" data-form-options='{ "dropdownAppendTo": "self" }'>
<select name="lqd-filter-dropdown-pf-filter-case-studies" id="lqd-filter-dropdown-pf-filter-case-studies">
<option selected data-filter="*" value="*">All</option>
<option data-filter=".branding" value=".branding">Marketing</option>
<option data-filter=".healthcare" value=".custom-print">HealthCare</option>
<option data-filter=".mobility" value=".mobility">Mobility</option>
<option data-filter=".ecommerce" value=".ecommerce">Ecommerce</option>
</select>
</div>
<a href="#contact-modal" class="btn btn-naked btn-icon-right btn-hover-swp text-13 font-normal uppercase leading-1em text-black rounded-100 whitespace-nowrap capitalize" data-lity="#contact-modal">
<span class="btn-txt" data-text="Contact me">Contact me</span>
<span class="btn-icon">
<i class="lqd-icn-ess icon-md-arrow-forward"></i>
</span>
<span class="btn-icon">
<i class="lqd-icn-ess icon-md-arrow-forward"></i>
</span>
</a>
</div>
</div>
<div class="lqd-pf-row row flex flex-wrap -mr-30 -ml-30" data-liquid-masonry="true" data-masonry-options='{ "filtersID": "#pf-filter-case-studies", "filtersCounter": true }'>
<?php
foreach ($recent_works as $ritem){
$category = $ritem['category'];
?>
<div class="lqd-pf-column masonry-item digital-design <?=$category?> col-12 col-sm-6 col-lg-4 px-30">
<article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">
<div class="lqd-pf-item-inner rounded-inherit">
<div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">
<figure class="w-full">
<img width="581" height="524" src="<?=$ritem['banner']?>" alt="case studies">
</figure>
<span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">
<i class="lqd-icn-ess icon-md-arrow-forward"></i>
</span>
</div>
<div class="lqd-pf-details">
<h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1"><?=$ritem['title']?></h2>
<ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">
<li>
<a href="#"><?=$ritem['description']?></a>
</li>
</ul>
</div>
<a href="<?=$ritem['banner']?>" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>
</div>
</article>
</div>
<?php
}
?>
<!-- <div class="lqd-pf-column masonry-item digital-design ecommerce col-12 col-sm-6 col-lg-4 px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="524" src="./assets/images/demo/asymmetric-9/case-studies/1.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Beer</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Digital Design</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/1.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
<!-- <div class="lqd-pf-column masonry-item ecommerce masonry col-12 col-sm-6 col-lg-4 px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="527" src="./assets/images/demo/asymmetric-9/case-studies/2.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Nike</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Ecommerce</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/2.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
<!-- <div class="lqd-pf-column masonry-item branding custom-print masonry col-12 col-sm-6 col-lg-4 px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="524" src="./assets/images/demo/asymmetric-9/case-studies/3.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Psalms</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Branding</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/3.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
<!-- <div class="lqd-pf-column col-12 col-sm-6 col-lg-4 masonry-item branding digital-design masonry px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="524" src="./assets/images/demo/asymmetric-9/case-studies/4.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Pixel Phone</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Branding</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/4.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
<!-- <div class="lqd-pf-column masonry-item custom-print ecommerce masonry col-12 col-sm-6 col-lg-4 px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="527" src="./assets/images/demo/asymmetric-9/case-studies/5.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Next Bank</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Custom Print</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/5.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
<!-- <div class="lqd-pf-column masonry-item custom-print masonry col-12 col-sm-6 col-lg-4 px-30">-->
<!-- <article class="lqd-pf-item lqd-pf-item-style-2 lqd-pf-overlay-bg-scale lqd-pf-dark pf-details-h-str rounded-6">-->
<!-- <div class="lqd-pf-item-inner rounded-inherit">-->
<!-- <div class="lqd-pf-img mb-1em relative rounded-6 overflow-hidden">-->
<!-- <figure class="w-full">-->
<!-- <img width="581" height="524" src="./assets/images/demo/asymmetric-9/case-studies/6.jpg" alt="case studies">-->
<!-- </figure>-->
<!-- <span class="lqd-pf-overlay-bg lqd-overlay flex items-center justify-center">-->
<!-- <i class="lqd-icn-ess icon-md-arrow-forward"></i>-->
<!-- </span>-->
<!-- </div>-->
<!-- <div class="lqd-pf-details">-->
<!-- <h2 class="lqd-pf-title text-22 font-semibold text-black mt-0 mb-1">Network</h2>-->
<!-- <ul class="lqd-pf-cat reset-ul inline-nav inline-flex relative z-2">-->
<!-- <li>-->
<!-- <a href="#">Custom Print</a>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </div>-->
<!-- <a href="./assets/images/demo/asymmetric-9/case-studies/6.jpg" class="lqd-overlay flex lqd-pf-overlay-link lqd-cc-icon-trigger fresco" data-fresco-group="true"></a>-->
<!-- </div>-->
<!-- </article>-->
<!-- </div>-->
</div>
</div>
</div>
</div>
</div>
</section>
<!-- End Case Studies -->
<?php
// include 'service_section.php'
?>
<!-- Start Testimonials -->
<section class="lqd-section testimonials text-white mb-80" id="testimonials" data-custom-animations="true" data-ca-options='{"animationTarget": ".animation-element", "ease": "back.out", "direction": "backward", "initValues": {"y": "100px", "opacity" : 0} , "animations": {"y": "0px", "opacity" : 1}}'>
<div class="container">
<div class="row">
<div class="w-full flex flex-col items-start flex-wrap p-0">
<div class="ld-fancy-heading relative leading-1/5em px-10 bg-lightgray rounded-4 animation-element">
<h6 class="ld-fh-element inline-block relative text-10 font-bold uppercase tracking-1 m-0">Blog</h6>
</div>
<div class="w-full flex flex-wrap flex-grow-1 items-center justify-start">
<div class="ld-fancy-heading relative animation-element">
<h2 class="ld-fh-element inline-block relative text-white text-68 mr-0/5em mb-0">Blog Articles</h2>
</div>
<span class="btn text-14 font-bold uppercase leading-1em tracking-1 text-white border-2 rounded-100 py-0/6em px-1em bg-white-0 border-white mr-10 hover:bg-white hover:text-black animation-element">
<span class="btn-txt" data-text="read more">read more</span>
</span>
<span class="text-14 font-bold uppercase leading-1em tracking-1 text-black rounded-100 btn btn-solid btn-custom-size btn-icon-block btn-icon-top w-35 h-35 bg-accent border-none p-0 w-35 h-35 animation-element">
<span class="btn-icon w-1em">
<svg xmlns="http://www.w3.org/2000/svg" width="10.625" height="10.625" viewBox="0 0 10.625 10.625">
<path d="M-1.76-11.322H5.313V-4.25H3.885V-8.932L-4.316-.7l-1-1,8.2-8.234H-1.76Z" transform="translate(5.313 11.322)"></path>
</svg>
</span>
</span>
<div class="divider w-full max-w-full items-center py-30 animation-element">
<h5 class="text-14 uppercase tracking-1 text-white mr-20 mb-0">Blog </h5>
<span class="divider-separator items-center"></span>
</div>
</div>
</div>
<div class="w-full flex items-center justify-start flex-wrap"></div>
<div class="w-55percent flex flex-col flex-wrap md:w-full">
<div class="lqd-imggrp-single block relative mb-25 animation-element">
<div class="lqd-imggrp-img-container inline-flex relative items-center justify-center">
<figure class="w-full relative">
<img width="26" height="26" src="./assets/images/demo/asymmetric-9/testimonials/Quote.svg" alt="testimonials">
</figure>
</div>
</div>
<div class="carousel-container relative carousel-nav-left carousel-nav-sm carousel-nav-shaped carousel-nav-solid carousel-nav-circle carousel-nav-left carousel-dots-inside carousel-dots-mobile-outside carousel-dots-mobile-left animation-element">
<div class="carousel-items relative" data-lqd-flickity='{"prevNextButtons": true, "navArrow": "6", "pageDots": true, "dotsIndicator": "numbers", "numbersStyle": "circle", "dotsAppendTo": "#testimonial-carousel-dots-holder", "cellAlign": "left", "groupCells": false, "buttonsAppendTo": "self", "addSlideNumbersToArrows": false}'>
<?php
foreach ($blogdata as $item){
//var_dump($data);
?>
<div class="carousel-item flex flex-col justify-center">
<div class="carousel-item-inner relative w-full mb-20">
<div class="carousel-item-content relative w-full text-20 text-white leading-1em">
<p><?=$item['post_title']?><br></p><img style="border-radius: 10px;" src="<?=$blog_media_url?>/<?=$item['meta_value']?>" alt="<?=$item['post_title']?>">
<div></div>
</div>
</div>
</div>
<?php
}
?>
</div>
</div>
</div>
<div class="w-45percent relative flex items-center justify-center flex-wrap md:hidden" id="testimonial-carousel-dots-holder">
</div>
</div>
</div>
</section>
<!-- End Testimonials -->
</section>
<!-- End Section Dark -->
<?php
// include 'news_section.php';
?>
<!-- Start Contact -->
<section class="lqd-section contact pt-60 pb-110" id="contact">
<div class="container">
<div class="row items-start">
<div class="w-45percent sm:w-full module-content">
<div class="ld-fancy-heading relative">
<h4 class="ld-fh-element inline-block relative mb-1/5em">Looking for collaboration or more information? Send an email to contact@oluameye.com</h4>
</div>
<div class="flex justify-start items-center">
<a href="#contact-modal" class="button btn text-14 font-bold uppercase leading-1em tracking-1 text-black border-2 rounded-100 btn py-0/6em px-1em mr-10 hover:bg-black hover:text-white" data-lity="#contact-modal">
<span class="btn-txt" data-text="Send a message">Send a message</span>
</a>
<a href="#" class="text-14 font-bold uppercase leading-1em tracking-1 text-black rounded-100 btn btn-solid btn-custom-size btn-icon-block btn-icon-top w-35 h-35 bg-accent mr-10 border-none p-0 w-35 h-35 " target="_blank" rel="nofollow">
<span class="btn-icon w-1em">
<svg xmlns="http://www.w3.org/2000/svg" width="10.625" height="10.625" viewBox="0 0 10.625 10.625">
<path d="M-1.76-11.322H5.313V-4.25H3.885V-8.932L-4.316-.7l-1-1,8.2-8.234H-1.76Z" transform="translate(5.313 11.322)"></path>
</svg>
</span>
</a>
</div>
</div>
<div class="w-50percent sm:w-full">
<div class="lqd-contact-form lqd-contact-form-inputs-underlined lqd-contact-form-button-block lqd-contact-form-button-circle">
<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">
<p>
<span class="lqd-form-control-wrap" data-name="text">
<input type="text" name="name" value="" size="40" class="lqd-cf-form-control text-15 border-black-50" aria-required="true" aria-invalid="false" placeholder="Your name">
</span>
<span class="lqd-form-control-wrap" data-name="email">
<input type="email" name="email" value="" size="40" class="lqd-cf-form-control text-15 border-black-50" aria-required="true" aria-invalid="false" placeholder="Email address">
</span>
<!-- <span class="lqd-form-control-wrap text-15 border-bottom border-black-20" data-name="your-subject2">-->
<!-- <select name="your-subject2" class="wpcf7-form-control" aria-required="true" aria-invalid="false">-->
<!-- <option value="Your budget">budget</option>-->
<!-- <option value="&lt; 1000">&lt; 1000</option>-->
<!-- <option value="&lt; 2000">&lt; 2000</option>-->
<!-- <option value="&lt; 3000">&lt; 3000</option>-->
<!-- </select>-->
<!-- </span>-->
<span class="lqd-form-control-wrap" data-name="textarea">
<textarea name="textarea" cols="10" rows="5" class="lqd-cf-form-control text-15 border-black-50" aria-required="true" aria-invalid="false" placeholder="Your message"></textarea>
</span>
<span class="lqd-form-control-wrap border-black-50" data-name="acceptance">
<span class="lqd-cf-form-control lqd-cf-acceptance optional">
<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>
<input type="submit" value="Send message" class="lqd-cf-form-control has-spinner bg-transparent border-black text-14 font-bold uppercase leading-1em tracking-1 hover:text-white hover:bg-black">
</p>
</form>
<div class="lqd-cf-response-output"></div>
</div>
</div>
</div>
<div class="col col-m-d-1 xs:hidden sm:hidden"></div>
</div>
</div>
</section>
<!-- End Contact -->
</div>
</main>
<footer id="site-footer" class="main-footer bg-dark text-white-50" data-sticky-footer="true">
<section class="lqd-section module-top pt-70">
<div class="container">
<div class="row items-center">
<div class="w-40percent relative flex flex-wrap content-start lg:w-50percent sm:w-full module-col">
<div class="ld-fancy-heading relative">
<h4 class="ld-fh-element inline-block relative text-50 -tracking-1 mb-0/35em text-white">Keep in touch.</h4>
</div>
<div class="flex justify-start items-center">
<a href="#contact-modal" class="button btn text-14 font-bold uppercase leading-1em tracking-1 text-black border-2 rounded-100 whitespace-nowrap py-0/6em px-1em text-white border-white bg-white-0 mr-10" data-lity="#contact-modal">
<span class="btn-txt" data-text="contact us">contact us</span>
</a>
<a href="#" class="text-14 font-bold uppercase leading-1em tracking-1 text-black rounded-100 btn btn-solid btn-custom-size btn-icon-block btn-icon-top w-35 h-35 bg-accent mr-10 border-none p-0 w-35 h-35 " target="_blank" rel="nofollow">
<span class="btn-icon w-1em">
<svg xmlns="http://www.w3.org/2000/svg" width="10.625" height="10.625" viewBox="0 0 10.625 10.625">
<path d="M-1.76-11.322H5.313V-4.25H3.885V-8.932L-4.316-.7l-1-1,8.2-8.234H-1.76Z" transform="translate(5.313 11.322)"></path>
</svg>
</span>
</a>
</div>
</div>
<div class="w-60percent relative flex flex-col pl-200 sm:w-full lg:p-0">
<div class="absolute max-w-full top-0 ltr-right-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="48" height="48" src="./assets/images/demo/asymmetric-9/shape/arrow-2.svg" alt="shape arrow">
</figure>
</div>
</div>
</div>
</div>
<div class="max-w-full relative flex flex-grow-1">
<div class="divider w-full mt-50 py-15">
<span class="divider-separator w-full"></span>
</div>
</div>
</div>
</div>
</section>
<section class="lqd-section module-menu pt-45">
<div class="container">
<div class="row">
<div class="w-30percent flex flex-auto flex-col mb-20 lg:w-33percent sm:w-50percent">
<div class="ld-fancy-heading relative">
<h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-3em text-white-30">Company</h3>
</div>
<div class="lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none">
<ul class="reset-ul link-15">
<li class="mb-20">
<a class="text-white-70" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
Contact Us
</a>
</li>
<!-- <li class="mb-20">-->
<!-- <a class="text-white-70" href="#">-->
<!-- <span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>-->
<!-- FAQ-->
<!-- <span class="link-badge">SOON</span>-->
<!-- </a>-->
<!-- </li>-->
<!-- <li class="mb-20">-->
<!-- <a class="text-white-70" href="#">-->
<!-- <span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>-->
<!-- Report A Bug-->
<!-- </a>-->
<!-- </li>-->
<!-- <li class="mb-20">-->
<!-- <a class="text-white-70" href="#">-->
<!-- <span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>-->
<!-- Careers-->
<!-- </a>-->
<!-- </li>-->
<li>
<a class="text-white-70" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>
About Me
</a>
</li>
</ul>
</div>
</div>
<div class="w-20percent flex flex-auto flex-col mb-20 lg:w-33percent sm:w-50percent">
<div class="ld-fancy-heading relative">
<h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-3em text-white-30">Products</h3>
</div>
<div class="lqd-fancy-menu lqd-custom-menu relative lqd-menu-td-none">
<ul class="reset-ul link-15">
<li class="mb-20">
<a class="text-white-70" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>Projects</a>
</li>
<li class="mb-20">
<a class="text-white-70" href="#">
<span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>Blog</a>
</li>
<!-- <li class="mb-20">-->
<!-- <a class="text-white-70" href="#">-->
<!-- <span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>Privacy Policy</a>-->
<!-- </li>-->
<!-- <li>-->
<!-- <a class="text-white-70" href="#">-->
<!-- <span class="link-icon inline-flex hide-if-empty left-icon icon-next-to-label"></span>Careers</a>-->
<!-- </li>-->
</ul>
</div>
</div>
<div class="w-20percent flex flex-auto flex-col mb-20 lg:w-33percent sm:w-full">
<div class="ld-fancy-heading relative">
<h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-3em text-white-30">Need help?</h3>
</div>
<!-- <div class="ld-fancy-heading relative">-->
<!-- <h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-1em text-white-30">Call us directly</h3>-->
<!-- </div>-->
<!-- <div class="ld-fancy-heading relative mb-1em">-->
<!-- <h5 class="ld-fh-element mb-0/5em inline-block relative text-18 font-semibold text-white">+(1) 123 656 7890</h5>-->
<!-- </div>-->
<div class="ld-fancy-heading relative">
<h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-1em text-white-30">Contact</h3>
</div>
<div class="ld-fancy-heading relative">
<h5 class="ld-fh-element mb-0/5em inline-block relative">
<span class="text-white text-18 font-semibold">contact@oluameye.com</span>
</h5>
</div>
</div>
<div class="w-30percent flex flex-auto flex-col mb-20 lg:w-full module-col">
<div class="ld-fancy-heading relative">
<h3 class="ld-fh-element inline-block relative text-10 uppercase tracking-2 mb-3em text-white-30">KEEP IN TOUCH</h3>
</div>
<div class="ld-sf relative ld-sf--input-underlined ld-sf--button-naked ld-sf--size-sm ld-sf--circle ld-sf--inputs-has-border ld-sf--border-thin ld-sf--button-show ld-sf--button-inside">
<form class="ld_sf_form relative" method="post" action="#">
<p class="relative">
<input type="email" class="block w-full text-white-50 text-14 border-white-20" name="email" placeholder="Enter your email address">
</p>
<button type="submit" class="inline-flex items-center justify-center m-0 text-12 font-bold text-white">
<span class="text-17 text-white">
<i class="lqd-icn-ess icon-ion-ios-arrow-forward"></i>
</span>
<span class="ld-sf-spinner rounded-full absolute overflow-hidden">
<span class="block lqd-overlay flex rounded-full">Sending </span>
</span>
</button>
</form>
<div class="ld_sf_response"></div>
</div>
</div>
</div>
</div>
</section>
<section class="lqd-section module-info pt-50 pb-90">
<div class="container">
<div class="row items-center">
<div class=" col-12 col-md-4 module-col">
<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" style="font-weight: bolder; font-size: 20px; color: white;">
Olu Ameye<!--
<img width="180" height="11" src="./assets/images/demo/asymmetric-9/logo/logo-light-1.svg" alt="asymetric 9">-->
</figure>
</div>
</div>
</div>
<div class="col col-12 col-md-4 text-center sm:text-start module-col">
<div class="ld-fancy-heading relative">
<p class="ld-fh-element mb-0/5em inline-block relative text-14 text-white-50">© <?=date("Y")?> Olu Ameye.</p>
</div>
</div>
<div class="col col-12 col-md-4 text-end sm:text-start">
<div class="social-icons-wrapper gap-50">
<a class="icon social-icon social-icon-facebook" href="#" target="_blank">
<span class="sr-only">Facebook</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<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="#FFFFFFA1" />
</svg>
</a>
<a class="icon social-icon social-icon-twitter" href="#" target="_blank">
<span class="sr-only">Twitter</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<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="#FFFFFFA1" />
</svg>
</a>
<a class="icon social-icon social-icon-medium" href="#" target="_blank">
<span class="sr-only">Medium</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512">
<path d="M180.5,74.262C80.813,74.262,0,155.633,0,256S80.819,437.738,180.5,437.738,361,356.373,361,256,280.191,74.262,180.5,74.262Zm288.25,10.646c-49.845,0-90.245,76.619-90.245,171.095s40.406,171.1,90.251,171.1,90.251-76.619,90.251-171.1H559C559,161.5,518.6,84.908,468.752,84.908Zm139.506,17.821c-17.526,0-31.735,68.628-31.735,153.274s14.2,153.274,31.735,153.274S640,340.631,640,256C640,171.351,625.785,102.729,608.258,102.729Z" fill="#FFFFFFA1" />
</svg>
</a>
</div>
</div>
</div>
</div>
</section>
</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-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 <span>message.</span></h2>
</div>
<div class="ld-fancy-heading">
<p class="ld-fh-element text-18 mb-0/5em">Ready to answer any question you may have.</p>
</div>
<!-- <div class="w-full flex flex-row flex-grow-1 gap-10 module-info sm:flex-col sm:flex-wrap">-->
<!-- <div class="w-50percent flex flex-col gap-10">-->
<!-- <div class="ld-fancy-heading relative">-->
<!-- <h6 class="ld-fh-element text-14 font-bold text-black mb-0/5em tracking-0 mb-0/5em inline-block relative">careers</h6>-->
<!-- </div>-->
<!-- <div class="ld-fancy-heading relative">-->
<!-- <p class="ld-fh-element text-16 leading-1/2em mb-0/5em mb-0/5em inline-block relative">Would you like to join our growing team?</p>-->
<!-- </div>-->
<!-- <div class="ld-fancy-heading relative">-->
<!-- <p class="ld-fh-element mb-0/5em inline-block relative text-16 font-bold leading-1/2em">contact@oluameye.com</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 text-14 font-bold text-black mb-0/5em tracking-0 mb-0/5em inline-block relative">Feedbacks</h6>-->
<!-- </div>-->
<!-- <div class="ld-fancy-heading relative">-->
<!-- <p class="ld-fh-element text-16 leading-1/2em mb-0/5em mb-0/5em inline-block relative">Have a project in mind? Send a message.</p>-->
<!-- </div>-->
<!-- <div class="ld-fancy-heading relative">-->
<!-- <p class="ld-fh-element mb-0/5em inline-block relative">-->
<!-- <span class="text-16 font-bold leading-1/2em">contact@oluameye.com </span>-->
<!-- </p>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
</div>
</div>
<div class="w-45percent relative flex flex-col sm:w-full 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 col-12 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 col-12 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 col-12 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 col-12 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 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 rounded-100 border-none">
<!-- <p class="mt-1/25em text-black">— copy email: info@liquid-themes.com</p>-->
</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/fastdom/fastdom.min.js"></script>
<script src="./assets/vendors/fresco/js/fresco.js"></script>
<script src="./assets/vendors/lity/lity.min.js"></script>
<script src="./assets/vendors/gsap/minified/gsap.min.js"></script>
<script src="./assets/vendors/gsap/utils/CustomEase.min.js"></script>
<script src="./assets/vendors/gsap/minified/ScrollTrigger.min.js"></script>
<script src="./assets/vendors/fontfaceobserver.js"></script>
<script src="./assets/vendors/gsap/utils/SplitText.min.js"></script>
<script src="./assets/vendors/flickity/flickity.pkgd.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/isotope/isotope.pkgd.min.js"></script>
<script src="./assets/vendors/isotope/packery-mode.pkgd.min.js"></script>
<script src="./assets/vendors/section-flow/liquidSectionFlow.min.js"></script>
<script src="./assets/vendors/flickity/flickity-fade.min.js"></script>
<script src="./assets/vendors/body-clip/liquidBodyClip.min.js"></script>
<script src="./assets/vendors/particles.min.js"></script>
<script src="./assets/vendors/tinycolor-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>
<!-- Start custom cursor -->
<div class="lqd-cc lqd-cc--inner fixed pointer-events-none"></div>
<div class="lqd-cc--el lqd-cc-solid lqd-cc-explore flex items-center justify-center rounded-full fixed pointer-events-none">
<div class="lqd-cc-solid-bg flex absolute lqd-overlay"></div>
<div class="lqd-cc-solid-txt flex justify-center text-center relative">
<div class="lqd-cc-solid-txt-inner">Explide</div>
</div>
</div>
<div class="lqd-cc--el lqd-cc-solid lqd-cc-drag flex items-center justify-center rounded-full fixed pointer-events-none">
<div class="lqd-cc-solid-bg flex absolute lqd-overlay"></div>
<div class="lqd-cc-solid-ext lqd-cc-solid-ext-left inline-flex items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" style="width: 1em; height: 1em;"><path fill="currentColor" d="M19.943 6.07L9.837 14.73a1.486 1.486 0 0 0 0 2.25l10.106 8.661c.96.826 2.457.145 2.447-1.125V7.195c0-1.27-1.487-1.951-2.447-1.125z"></path></svg>
</div>
<div class="lqd-cc-solid-txt flex justify-center text-center relative">
<div class="lqd-cc-solid-txt-inner">Drag</div>
</div>
<div class="lqd-cc-solid-ext lqd-cc-solid-ext-right inline-flex items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" style="width: 1em; height: 1em;"><path fill="currentColor" d="M11.768 25.641l10.106-8.66a1.486 1.486 0 0 0 0-2.25L11.768 6.07c-.96-.826-2.457-.145-2.447 1.125v17.321c0 1.27 1.487 1.951 2.447 1.125z"></path></svg>
</div>
</div>
<div class="lqd-cc--el lqd-cc-arrow inline-flex items-center fixed top-0 left-0 pointer-events-none">
<svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M60.4993 0V4.77005H8.87285L80 75.9207L75.7886 79.1419L4.98796 8.35478V60.4993H0V0H60.4993Z"/>
</svg>
</div>
<div class="lqd-cc--el lqd-cc-custom-icon rounded-full fixed pointer-events-none">
<div class="lqd-cc-ci inline-flex items-center justify-center rounded-full relative">
<svg width="32" height="32" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" style="width: 1em; height: 1em;"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M16.03 6a1 1 0 0 1 1 1v8.02h8.02a1 1 0 1 1 0 2.01h-8.02v8.02a1 1 0 1 1-2.01 0v-8.02h-8.02a1 1 0 1 1 0-2.01h8.02v-8.01a1 1 0 0 1 1.01-1.01z"></path></svg>
</div>
</div>
<div class="lqd-cc lqd-cc--outer fixed top-0 left-0 pointer-events-none"></div>
<!-- End custom cursor -->
<template id="lqd-snickersbar">
<div class="lqd-snickersbar flex flex-wrap lqd-snickersbar-in" data-item-id>
<div class="lqd-snickersbar-inner flex flex-wrap items-center">
<div class="lqd-snickersbar-detail">
<p class="hidden lqd-snickersbar-addding-temp my-0">Adding {{itemName}} to cart</p>
<p class="hidden lqd-snickersbar-added-temp my-0">Added {{itemName}} to cart</p>
<p class="my-0 lqd-snickersbar-msg flex items-center my-0"></p>
<p class="my-0 lqd-snickersbar-msg-done flex items-center my-0"></p>
</div>
<div class="lqd-snickersbar-ext ml-4"></div>
</div>
</div>
</template>
<template id="lqd-temp-sticky-header-sentinel">
<div class="lqd-sticky-sentinel invisible absolute pointer-events-none"></div>
</template>
<div class="lity" role="dialog" aria-label="Dialog Window (Press escape to close)" tabindex="-1" data-modal-type="default">
<div class="lity-wrap" data-lity-close role="document">
<div class="lity-loader" aria-hidden="true">Loading...</div>
<div class="lity-container">
<div class="lity-content"></div>
</div>
<button class="lity-close" type="button" aria-label="Close (Press escape to close)" data-lity-close>&times;</button>
</div>
</div>
</body>
</html>