<body id="if2c">
<nav id="itli" x-data="{ isOpen: false }" class="fixed w-full z-50 p-6">
<div
class="p-2 w-full mx-auto rounded-lg flex flex-col lg:flex-row bg-white bg-opacity-80 backdrop-filter backdrop-blur container"
>
<div class="h-12 flex justify-between">
<a href="#"
><img
id="ievq"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/nHIIseMiqsJ1YQSa7p0I2QTPYjZSgK7FlrRhn8rE.png"
class="h-full"
/></a>
<div
x-on:click="isOpen = !isOpen"
x-on:click.outside="isOpen = false"
class="w-12 flex items-center justify-center lg:hidden cursor-pointer"
>
<span
id="mobile_nav_icon_close"
:class="!isOpen ? '' : 'hidden'"
class=""
><i class="fas fa-bars"></i></span
><span
id="mobile_nav_icon_open"
:class="isOpen ? '' : 'hidden'"
class="hidden"
><i class="fas fa-times"></i
></span>
</div>
</div>
<div
:class="isOpen ? '' : 'hidden'"
class="flex-grow justify-end flex-col lg:flex lg:flex-row pt-4 lg:pt-0 hidden"
>
<a
id="i3ywi"
href="#services"
class="rounded-lg px-6 flex items-center h-12 -mx-2 lg:mx-0 hover:text-orange-500"
>Services</a
><a
id="iwxca"
href="#products"
class="rounded-lg px-6 flex items-center h-12 -mx-2 lg:mx-0 hover:text-orange-500"
>Products</a
><a
id="iat1b"
href="#about"
class="rounded-lg px-6 flex items-center h-12 -mx-2 lg:mx-0 hover:text-orange-500"
>About</a
><a
id="iaygu"
href="#contact"
class="bg-neutral-800 text-white rounded-lg font-semibold px-6 flex items-center justify-center hover:opacity-80 mx-4 mb-4 lg:mb-0 lg:mr-0 lg:ml-4 h-12 mt-4 lg:mt-0"
>Contact Us</a
>
</div>
</div>
</nav>
<section id="i1y6j" class="container mx-auto mb-16 lg:pt-28">
<div
id="ix5kn"
class="py-28 lg:py-20 px-0 lg:px-16 relative flex items-center justify-center h-screen lg:h-min lg:rounded-lg bg-gradient-to-b from-white to-neutral-200"
>
<div class="max-w-screen-lg mx-auto flex flex-col items-center px-6 z-10">
<h1 id="is6u8" class="text-4xl lg:text-7xl font-bold text-center mb-4">
Transform Your Idea<br />Into <span
class="text-orange-600"
id="ixj3p"
>Great Product</span
>
</h1>
<p
class="text-2xl lg:text-4xl mb-6 lg:mb-8 text-center font-semibold"
id="id97k"
>
Empowering Business to Build, Innovate, and Succeed<br />
</p>
<div
class="aspect-video w-full relative mb-4 lg:mb-8 max-w-2xl"
id="imfy1"
>
<img
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/d2paBBajOJhlde008ImzzLUc416b1H1PnVYIwPjA.png"
id="ifdyv"
class="w-full h-full top-0 left-0 absolute lg:rounded-lg object-contain"
/>
</div>
<div
class="w-full flex gap-4 justify-center flex-col lg:flex-row"
id="i6ixf"
>
<a
href="#services"
class="bg-orange-600 text-white text-xl rounded-lg px-8 h-14 w-full lg:max-w-max py-4 flex items-center justify-center hover:opacity-80 font-semibold"
id="ihdgl"
>Services</a
><a
href="#products"
id="ib08uq"
class="bg-white text-orange-600 text-xl rounded-lg px-8 h-14 w-full lg:max-w-max py-4 flex items-center justify-center hover:opacity-80 font-semibold"
>Products</a
>
</div>
</div>
</div>
</section>
<section id="if6xg" class="px-6 lg:px-16 my-4 lg:my-8 container mx-auto">
<div class="flex items-center mb-4 lg:mb-8" id="ihxr9">
<div class="flex-grow border-orange-100 border-t border-2"></div>
<div class="px-4 font-bold text-2xl lg:text-4xl">
<p id="ibn3j">Partners & Clients</p>
</div>
<div class="flex-grow border-orange-100 border-t border-2"></div>
</div>
<div id="i5xkv" class="grid grid-cols-2 lg:grid-cols-6 gap-8 lg:gap-4">
<div class="h-16 rounded flex items-center justify-center">
<img
id="iw983"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/BqTUYp2qYmWqGswNctnrKtjnmGm2VRH0flBWBqp0.jpg"
class="h-16 w-full object-contain grayscale"
/>
</div>
<div class="h-16 rounded flex items-center justify-center">
<img
id="i8w79"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/sclsxL6yquoFtvqqynPFvl5IojUriBmd8NIhji2i.jpg"
class="h-16 w-full object-contain grayscale"
/>
</div>
<div class="h-16 rounded flex items-center justify-center">
<img
id="i3qcyd"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/GyNf4msaHDo29ovFPJfltU3HI92AnTGtb5Hlmc84.png"
class="h-16 w-full object-contain grayscale"
/>
</div>
<div class="h-16 rounded flex items-center justify-center">
<img
id="idt1l8"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/FqSSjd38DtpdTKNkvUVU1w0IFUWzFqEzCPS5jdRT.png"
class="h-16 w-full object-contain grayscale"
/>
</div>
<div id="ikbqf" class="h-16 rounded flex items-center justify-center">
<img
id="i2i92"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/fKscwVs4X6g9Dn40SuwC82m2bJ2VmJBDQEYGycuT.png"
class="h-16 w-full object-contain grayscale"
/>
</div>
<div id="imuaw8" class="h-16 rounded flex items-center justify-center">
<img
id="i77ezm"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/iBqa4qHQaOaLN01dPMwN164BejacQZ0rolhUNup1.png"
class="h-16 w-full object-contain grayscale"
/>
</div>
</div>
</section>
<section id="services" class="h-20"></section>
<section id="irchk" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="grid grid-cols-1 mb-4 lg:mb-8 lg:mx-24">
<div class="col-span-1"></div>
<div>
<h1 class="text-3xl lg:text-6xl capitalize font-bold mb-2 lg:mb-4">
Software Solutions Tailored for Your Business
</h1>
</div>
<div class="flex items-center">
<p class="text-xl lg:text-2xl w-full text-left opacity-80">
At Bookklik, we believe that every business deserves a software
solution that fits their unique needs. Our team of expert developers
creates custom solutions to help you streamline processes, boost
productivity, and drive growth.
</p>
</div>
</div>
<div class="grid lg:grid-cols-3 gap-4">
<div class="border border-neutral-200 rounded-lg p-4 flex flex-col">
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-vr-cardboard"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">Virtual Reality (VR)<br /></h4>
<p class="text-lg">
We provide immersive 3D visualization to wow your audience and make a
lasting mark for your brands.<br />
</p>
</div>
<div
id="i9mhd"
class="border border-neutral-200 rounded-lg p-4 flex flex-col"
>
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-cube"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">Augmented Reality (AR)<br /></h4>
<p class="text-lg">
We offer unique Augmented Reality solution for myriad applications,
including tourism, education, exhibition, and many more.<br />
</p>
</div>
<div class="border border-neutral-200 rounded-lg p-4 flex flex-col">
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-globe"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">
Website & Web System<br />
</h4>
<p class="text-lg">
Our team use pixels and codes to create beautiful things. We design
and develop award-winning portals & websites using the latest
technologies.<br />
</p>
</div>
<div class="border border-neutral-200 rounded-lg p-4 flex flex-col">
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-mobile"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">Mobile App Development<br /></h4>
<p class="text-lg">
Our app developers build native and hybrid mobile applications on IOS,
Android, and Windows, for a variety of mobile devices and tablets.<br />
</p>
</div>
<div class="border border-neutral-200 rounded-lg p-4 flex flex-col">
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-palette"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">Graphic Design<br /></h4>
<p class="text-lg">
We help you find the right pixels combination for your brands or
products.<br />
</p>
</div>
<div class="border border-neutral-200 rounded-lg p-4 flex flex-col">
<div
class="bg-gray-800 text-orange-500 w-16 rounded-md mb-8 h-16 flex items-center justify-center text-4xl"
>
<i class="fas fa-chalkboard-teacher"></i>
</div>
<h4 class="mb-2 font-semibold text-lg">Training<br /></h4>
<p class="text-lg">
We provide training in web and mobile application development for
beginners who are eager to learn.<br />
</p>
</div>
</div>
</section>
<section class="h-20"></section>
<section id="iia0d1" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="flex flex-col gap-16 lg:gap-32">
<div class="flex flex-col lg:mx-24">
<div class="grid lg:grid-cols-3 gap-8 lg:gap-16">
<div
class="order-2 lg:order-1 lg:col-span-2 flex flex-col justify-center gap-4 lg:gap-8"
>
<p id="ib9e5z" class="text-2xl lg:text-4xl font-bold">
Leverage Our Expertise in IT and Software Development
</p>
<p class="text-xl lg:text-2xl">
Benefit from our years of experience and proven track record in
the industry. With a focus on innovation and collaboration, we
create software that delivers real value to your business.
</p>
<a
href="#products"
class="border-gray-800 border-2 text-gray-800 rounded-lg text-lg font-semibold px-6 w-full lg:max-w-max h-12 flex items-center justify-center hover:opacity-80"
>Our Works</a
>
</div>
<div class="order-1 lg:order-2">
<img
src="https://cdn.glitch.global/82d64943-fcf3-455b-bf6d-b3e19eb9a042/undraw_progressive_app_m-9-ms.svg?v=1704883424315"
class="w-full h-full object-contain"
/>
</div>
</div>
</div>
<div class="flex flex-col lg:mx-24">
<div class="grid lg:grid-cols-3 gap-8 lg:gap-16">
<div>
<img
src="https://cdn.glitch.global/82d64943-fcf3-455b-bf6d-b3e19eb9a042/undraw_design_sprint_re_tke3.svg?v=1704883423683"
class="w-full h-full object-contain"
/>
</div>
<div
class="lg:col-span-2 flex flex-col justify-center gap-4 lg:gap-8"
>
<p class="text-2xl lg:text-4xl font-bold">
Maximize Your Business Potential with Custom Software
</p>
<p class="text-xl lg:text-2xl">
Transform your ideas into reality with our custom software
solutions. From startups to established companies, we help you
reach new heights by optimizing processes and delivering
competitive advantages.
</p>
<a
id="iswbtx"
href="#contact"
class="bg-orange-600 text-white rounded-lg text-lg font-semibold px-6 w-full lg:max-w-max h-12 flex items-center justify-center hover:opacity-80"
>Talk To An Expert</a
>
</div>
</div>
</div>
</div>
</section>
<section id="products" class="h-20"></section>
<section id="i45ch1" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="grid grid-cols-1 mb-4 lg:mb-8 lg:mx-24">
<div class="col-span-1"></div>
<div>
<h1
id="iwb62y"
class="text-3xl lg:text-6xl capitalize font-bold mb-2 lg:mb-4"
>
Our Previous Work - Proof of Our Expertise
</h1>
</div>
<div class="flex items-center">
<p id="it0vps" class="text-xl lg:text-2xl w-full text-left opacity-70">
Explore our diverse range of software development projects that
showcase our team's capabilities. From simple web applications to
complex enterprise solutions, we've got you covered.
</p>
</div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-y-4 lg:gap-4">
<div
id="ifim5u"
class="rounded-lg border border-gray-300 overflow-hidden flex flex-col justify-between group"
>
<div
class="p-4 lg:p-8 text-center flex flex-col justify-between h-full"
>
<div id="ijjb2h">
<div class="text-lg lg:text-3xl mb-2 lg:mb-4 font-bold">
Kad Kahwin Digital
</div>
<div id="ion706" class="text-base lg:text-lg mb-4 lg:mb-8">
Revolusi Kad Kahwin - E-card wedding invitation revolution with
Chat AI feature
</div>
</div>
<div id="ib9ess" class="flex justify-center">
<a
id="is8dpb"
href="https://hub.kadkahwindigital.my/"
class="font-semibold text-orange-600 lg:text-lg flex items-center gap-2 pr-1 hover:gap-3 hover:pr-0 hover:opacity-80"
>Learn More<i class="fas fa-arrow-right"></i
></a>
</div>
</div>
<div>
<img
id="iqz78g"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/bKHt6iqx5qhHGyeDse0VNynU3Uy6yuyQT5LNqDoV.jpg"
class="w-full group-hover:translate-y-4 transition grayscale group-hover:grayscale-0"
/>
</div>
</div>
<div
id="ivbreb"
class="rounded-lg border border-gray-300 overflow-hidden flex flex-col justify-between group"
>
<div
id="iouupi"
class="p-4 lg:p-8 text-center flex flex-col justify-between h-full"
>
<div id="ih3d3p">
<div class="text-lg lg:text-3xl mb-2 lg:mb-4 font-bold">
SenangWebs
</div>
<div id="inyi5b" class="text-base lg:text-lg mb-4 lg:mb-8">
Effortless Web Design, Your Way! Drag and drop static page website
builder
</div>
</div>
<div class="flex justify-center">
<a
id="iz0gwi"
href="https://use.senangwebs.com"
class="font-semibold text-orange-600 lg:text-lg flex items-center gap-2 pr-1 hover:gap-3 hover:pr-0 hover:opacity-80"
>Learn More<i class="fas fa-arrow-right"></i
></a>
</div>
</div>
<div>
<img
id="ie1xqz"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/Jkp2dzJV33HhxiMGpxGBpx8PyFfyUA62BJLWRX2Q.jpg"
class="w-full group-hover:translate-y-4 transition grayscale group-hover:grayscale-0"
/>
</div>
</div>
<div
id="ixi16u"
class="rounded-lg border border-gray-300 overflow-hidden flex flex-col justify-between group"
>
<div
id="iefxe5"
class="p-4 lg:p-8 text-center flex flex-col justify-between h-full"
>
<div>
<div id="i765y2" class="text-lg lg:text-3xl mb-2 lg:mb-4 font-bold">
QHeat
</div>
<div id="il5zfi" class="text-base lg:text-lg mb-4 lg:mb-8">
Advanced heat transfer calculator with preset parameter &
built in workflow generator
</div>
</div>
<div class="flex justify-center">
<a
id="ijau8a"
href="https://qheatapp.com/"
class="font-semibold text-orange-600 lg:text-lg flex items-center gap-2 pr-1 hover:gap-3 hover:pr-0 hover:opacity-80"
>Learn More<i class="fas fa-arrow-right"></i
></a>
</div>
</div>
<div>
<img
id="ilx3al"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/5TgVpcEQwgnccWGSjh33aJ0UBz7KEhNTDdXIIs9I.jpg"
class="w-full group-hover:translate-y-4 transition grayscale group-hover:grayscale-0"
/>
</div>
</div>
<div
id="icj8d9"
class="rounded-lg border border-gray-300 overflow-hidden flex flex-col justify-between group"
>
<div
id="iiu3jj"
class="p-4 lg:p-8 text-center flex flex-col justify-between h-full"
>
<div>
<div id="i6638l" class="text-lg lg:text-3xl mb-2 lg:mb-4 font-bold">
STEM-AR
</div>
<div id="i83aw5" class="text-base lg:text-lg mb-4 lg:mb-8">
Dive into the fascinating world of STEM (Science, Technology,
Engineering & Mathematic) through the lens of Augmented
Reality<br />
</div>
</div>
<div class="flex justify-center">
<a
id="imvnkg"
href="https://stem-ar.use.senangwebs.com/"
class="font-semibold text-orange-600 lg:text-lg flex items-center gap-2 pr-1 hover:gap-3 hover:pr-0 hover:opacity-80"
>Learn More<i class="fas fa-arrow-right"></i
></a>
</div>
</div>
<div>
<img
id="i8rdy4"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/HQVhyHmm9rWZlqeT76chVskHZW65fWbCDGEsK9Y6.jpg"
class="w-full group-hover:translate-y-4 transition grayscale group-hover:grayscale-0"
/>
</div>
</div>
</div>
</section>
<section id="ic39kg" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="flex items-center mb-4 lg:mb-8">
<div class="flex-grow border-orange-100 border-t border-2"></div>
<div class="px-4 font-bold text-2xl lg:text-4xl"><p>Awards</p></div>
<div class="flex-grow border-orange-100 border-t border-2"></div>
</div>
<div class="grid gap-4 lg:grid-cols-2">
<div
class="items-center justify-center p-4 rounded-lg bg-gradient-to-br from-white to-neutral-200 lg:p-8"
>
<div
class="w-16 h-16 flex items-center justify-center text-4xl bg-orange-600 text-white mb-4 rounded-full"
>
<i class="fas fa-trophy"></i>
</div>
<h1 class="text-2xl lg:text-4xl font-semibold mb-2">
1st Runner Up<br />
</h1>
<p class="lg:text-lg">UniMaker 2018 Northern Region<br /></p>
</div>
<div
class="items-center justify-center p-4 rounded-lg bg-gradient-to-br from-white to-neutral-200 lg:p-8"
>
<div
class="w-16 h-16 flex items-center justify-center text-4xl bg-orange-600 text-white mb-4 rounded-full"
>
<i class="fa-medapps fab"></i>
</div>
<h1 class="text-2xl lg:text-4xl font-semibold mb-2">
1st Runner Up<br />
</h1>
<p class="lg:text-lg">Inclusive Innovation Challenge 2017<br /></p>
</div>
<div
class="items-center justify-center p-4 rounded-lg bg-gradient-to-br from-white to-neutral-200 lg:p-8"
>
<div
class="w-16 h-16 flex items-center justify-center text-4xl bg-orange-600 text-white mb-4 rounded-full"
>
<i class="fas fa-medal"></i>
</div>
<h1 class="text-2xl lg:text-4xl font-semibold mb-2">
Gold Medal<br />
</h1>
<p class="lg:text-lg">
Invention, Innovation & Design Exposition 2018<br />
</p>
</div>
<div
class="items-center justify-center p-4 rounded-lg bg-gradient-to-br from-white to-neutral-200 lg:p-8"
>
<div
class="w-16 h-16 flex items-center justify-center text-4xl bg-orange-600 text-white mb-4 rounded-full"
>
<i class="fas fa-award"></i>
</div>
<h1 class="text-2xl lg:text-4xl font-semibold mb-2">
Diamond Award<br />
</h1>
<p class="lg:text-lg">
National Student Affair Invention, Innovation & Design
Competition<br />
</p>
</div>
</div>
</section>
<section id="about" class="h-20"></section>
<section id="ih1vna" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div class="p-0 mb-4 lg:mb-8 lg:mx-24">
<h1 class="text-3xl lg:text-6xl capitalize font-bold mb-2 lg:mb-6">
About
</h1>
<div class="mb-2 lg:mb-4">
<p class="text-xl lg:text-2xl opacity-80">
Begin as a side project in university, designing digital solution to
solve student’s textbooks problem. We are a group of problem solvers,
engineers and lifetime student at heart. A small but agile company
that approach every single project with flexibility and devotion. Yet,
big enough to accept challenges of all shapes and sizes.
</p>
</div>
</div>
<div class="lg:mx-24">
<img
id="i3evn9"
src="https://cdn.glitch.global/82d64943-fcf3-455b-bf6d-b3e19eb9a042/undraw_pair_programming_re_or4x.svg?v=1704645637570"
class="w-full object-contain"
/>
</div>
</section>
<section id="contact" class="h-20"></section>
<section id="i5mjqy" class="px-6 lg:px-16 my-8 lg:my-16 container mx-auto">
<div
class="rounded-lg bg-gradient-to-b from-white to-neutral-200 p-4 lg:px-16 lg:py-12 overflow-hidden relative grid grid-cols-1 lg:grid-cols-3 gap-4"
>
<div
id="idkx7p"
class="col-span-1 lg:col-span-2 flex flex-col justify-center"
>
<h1
id="isvtkz"
class="text-3xl lg:text-6xl capitalize font-semibold lg:font-bold mb-2"
>
Ready to Take Your Business to the Next Level?
</h1>
<p
id="i2aebj"
class="text-xl lg:text-2xl w-full opacity-70 mb-4 lg:mb-8"
>
Contact us today for a free consultation and let our team of experts
discuss how we can create a custom software solution tailored to your
business needs and goals.
</p>
<div id="i9v9v9" class="flex mb-4 lg:mb-8">
<div
class="w-16 rounded-full bg-orange-100 relative overflow-hidden mr-4 h-16"
>
<img
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/Hn772jyX6hVhhfO90vpJWDYg7zX7WgeHFPtFWgVm.jpg"
class="w-16 absolute top-0 right-0 grayscale"
/>
</div>
<div class="flex justify-center flex-col font-semibold">
<p class="text-lg">A.Hakim Noor</p>
<p id="iwxz4f" class="text-sm">Technology Officer</p>
</div>
</div>
<a
id="iks4tf"
href="https://bookklik.com/contact-us"
title="Contact Me"
class="bg-orange-600 text-white rounded-lg text-lg font-semibold px-6 w-full lg:max-w-max h-12 flex items-center justify-center hover:opacity-80"
>Contact Me Now</a
>
</div>
<div class="hidden lg:flex justify-right relative">
<img
src="https://cdn.glitch.global/82d64943-fcf3-455b-bf6d-b3e19eb9a042/undraw_chatting_re_j55r.svg?v=1704900866487"
class="w-full h-full absolute top-0 left-0 object-contain"
/>
</div>
</div>
</section>
<footer
id="i24yy9"
class="grid container mx-auto px-6 lg:px-16 gap-4 lg:grid-cols-3"
>
<div id="iy3cxj" class="flex flex-col gap-2">
<div class="h-12 max-w-max">
<img
id="i6sdn5"
src="https://assets.senangwebs.com/websites/1f3ee627-83f0-4ce7-8947-88bc240f08dd/images/nHIIseMiqsJ1YQSa7p0I2QTPYjZSgK7FlrRhn8rE.png"
class="h-12"
/>
</div>
<p id="is6v7q" class="text-sm max-w-sm">
Transform your idea into great product.
</p>
</div>
<div id="iqxzsu" class="flex flex-col gap-2">
<h4 id="i5k7n9" class="font-semibold text-lg">Site Map</h4>
<a id="i13a0r" href="#services" class="text-sm">Services</a
><a id="ihfa6b" href="#products" class="text-sm">Products</a
><a id="iitp5q" href="#about" class="text-sm">About</a
><a
id="isam3y"
href="https://bookklik.com/contact-us"
target="_blank"
class="text-sm"
>Contact</a
>
</div>
<div id="i9yylk" class="flex flex-col gap-2">
<h4 id="i670h2" class="font-semibold text-lg">Contact Us</h4>
<p id="irxqs5" class="text-sm">
<a
href="/cdn-cgi/l/email-protection"
class="__cf_email__"
data-cfemail="8de5e8e1e1e2cdefe2e6e6e1e4e6a3eee2e0"
>[email protected]</a
>
</p>
<p id="iwceoq" class="text-sm">+60 10 6646 026</p>
<p id="i45eh2" class="text-sm">Selangor, Malaysia</p>
</div>
</footer>
<footer
id="i8rhgl"
class="flex flex-col lg:flex-row container mx-auto pt-4 px-6 lg:px-16 mb-16"
>
<div class="flex justify-center">
<a
href="https://www.linkedin.com/company/bookklik-technologies-my/"
target="_blank"
class="bg-orange-100 rounded-md flex items-center justify-center w-8 h-8 text-orange-600 text-sm mr-2"
><i class="fab fa-linkedin"></i></a
><a
href="https://twitter.com/bookklik_my"
target="_blank"
class="bg-orange-100 rounded-md flex items-center justify-center w-8 h-8 text-orange-600 text-sm mr-2"
><i class="fab fa-twitter"></i></a
><a
href="https://www.facebook.com/bookklik.malaysia/"
target="_blank"
class="bg-orange-100 rounded-md flex items-center justify-center w-8 h-8 text-orange-600 text-sm mr-2"
><i class="fab fa-facebook"></i
></a>
</div>
<div
class="flex-grow h-8 flex items-center justify-center lg:justify-end font-semibold"
>
© Bookklik Technologies (PG0446745-V)
</div>
<div class="flex justify-center">
<a
href="#"
class="flex items-center justify-center w-8 h-8 text-sm lg:ml-4"
><i class="fas fa-arrow-up"></i
></a>
</div>
</footer>
</body>
Welcome to SenangStart Template Preview! 🎉 Visit our homepage for a deeper dive into our offerings, or you can edit this template with drag-n-drop website builder.
Edit Template