mirror of
https://github.com/istiyakaminsanto/tailShape.git
synced 2025-12-17 15:07:02 +00:00
1548 lines
86 KiB
HTML
1548 lines
86 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="dark">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="./../../../dist/tailshape.css">
|
|
<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
|
|
<title>Template 15</title>
|
|
</head>
|
|
<body>
|
|
<button class="dark_mode_button_custom_style" id="dark_mood_toogler">
|
|
d
|
|
</button>
|
|
|
|
|
|
|
|
|
|
|
|
<!-- header 11 start -->
|
|
<nav class="bg-white shadow dark:bg-gray-800">
|
|
<div class="container flex items-center justify-center p-6 mx-auto text-gray-600 capitalize dark:text-gray-300">
|
|
<a href="#" class="text-gray-800 transition-colors duration-200 transform dark:text-gray-200 border-b-2 border-blue-500 mx-1.5 sm:mx-6">home</a>
|
|
|
|
<a href="#" class="border-b-2 border-transparent hover:text-gray-800 transition-colors duration-200 transform dark:hover:text-gray-200 hover:border-blue-500 mx-1.5 sm:mx-6">features</a>
|
|
|
|
<a href="#" class="border-b-2 border-transparent hover:text-gray-800 transition-colors duration-200 transform dark:hover:text-gray-200 hover:border-blue-500 mx-1.5 sm:mx-6">pricing</a>
|
|
|
|
<a href="#" class="border-b-2 border-transparent hover:text-gray-800 transition-colors duration-200 transform dark:hover:text-gray-200 hover:border-blue-500 mx-1.5 sm:mx-6">blog</a>
|
|
|
|
<a href="#" class="border-b-2 border-transparent hover:text-gray-800 transition-colors duration-200 transform dark:hover:text-gray-200 hover:border-blue-500 mx-1.5 sm:mx-6">
|
|
<svg class="w-4 h-4 fill-current" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M1 11.9554V12.0446C1.01066 14.7301 1.98363 17.1885 3.59196 19.0931C4.05715 19.6439 4.57549 20.1485 5.13908 20.5987C5.70631 21.0519 6.31937 21.4501 6.97019 21.7853C7.90271 22.2656 8.91275 22.6165 9.97659 22.8143C10.5914 22.9286 11.2243 22.9918 11.8705 22.9993C11.9136 22.9998 11.9567 23 11.9999 23C15.6894 23 18.9547 21.1836 20.9502 18.3962C21.3681 17.8125 21.7303 17.1861 22.0291 16.525C22.6528 15.1448 22.9999 13.613 22.9999 12C22.9999 8.73978 21.5816 5.81084 19.3283 3.79653C18.8064 3.32998 18.2397 2.91249 17.6355 2.55132C15.9873 1.56615 14.0597 1 11.9999 1C11.888 1 11.7764 1.00167 11.6653 1.00499C9.99846 1.05479 8.42477 1.47541 7.0239 2.18719C6.07085 2.67144 5.19779 3.29045 4.42982 4.01914C3.7166 4.69587 3.09401 5.4672 2.58216 6.31302C2.22108 6.90969 1.91511 7.54343 1.6713 8.20718C1.24184 9.37631 1.00523 10.6386 1 11.9554ZM20.4812 15.0186C20.8171 14.075 20.9999 13.0588 20.9999 12C20.9999 9.54265 20.0151 7.31533 18.4186 5.6912C17.5975 7.05399 16.5148 8.18424 15.2668 9.0469C15.7351 10.2626 15.9886 11.5603 16.0045 12.8778C16.7692 13.0484 17.5274 13.304 18.2669 13.6488C19.0741 14.0252 19.8141 14.487 20.4812 15.0186ZM15.8413 14.8954C16.3752 15.0321 16.904 15.22 17.4217 15.4614C18.222 15.8346 18.9417 16.3105 19.5723 16.8661C18.0688 19.2008 15.5151 20.7953 12.5788 20.9817C13.5517 20.0585 14.3709 18.9405 14.972 17.6514C15.3909 16.7531 15.678 15.8272 15.8413 14.8954ZM13.9964 12.6219C13.9583 11.7382 13.7898 10.8684 13.5013 10.0408C10.6887 11.2998 7.36584 11.3765 4.35382 9.97197C4.01251 9.81281 3.68319 9.63837 3.36632 9.44983C3.12787 10.2584 2.99991 11.1142 2.99991 12C2.99991 13.9462 3.61763 15.748 4.6677 17.2203C6.83038 14.1875 10.3685 12.4987 13.9964 12.6219ZM6.047 18.7502C7.77258 16.059 10.7714 14.5382 13.8585 14.6191C13.723 15.3586 13.4919 16.093 13.1594 16.8062C12.3777 18.4825 11.1453 19.805 9.67385 20.6965C8.31043 20.3328 7.07441 19.6569 6.047 18.7502ZM11.9999 3C13.7846 3 15.4479 3.51946 16.847 4.41543C16.2113 5.54838 15.3593 6.4961 14.368 7.23057C13.3472 5.57072 11.8752 4.16433 10.027 3.21692C10.6619 3.07492 11.3222 3 11.9999 3ZM8.80619 4.84582C10.4462 5.61056 11.7474 6.80659 12.6379 8.23588C10.3464 9.24654 7.64722 9.30095 5.19906 8.15936C4.83384 7.98905 4.48541 7.79735 4.15458 7.58645C4.91365 6.24006 6.00929 5.10867 7.32734 4.30645C7.82672 4.44058 8.32138 4.61975 8.80619 4.84582Z" fill="currentColor" /></svg>
|
|
</a>
|
|
|
|
<a href="#" class="border-b-2 border-transparent hover:text-gray-800 transition-colors duration-200 transform dark:hover:text-gray-200 hover:border-blue-500 mx-1.5 sm:mx-6">
|
|
<svg class="w-5 h-5 fill-current" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m.75 19h7.092c4.552 0 6.131-6.037 2.107-8.203 2.701-2.354 1.029-6.797-2.595-6.797h-6.604c-.414 0-.75.336-.75.75v13.5c0 .414.336.75.75.75zm.75-13.5h5.854c3.211 0 3.215 4.768 0 4.768h-5.854zm0 6.268h6.342c3.861 0 3.861 5.732 0 5.732h-6.342z"/><path d="m18.374 7.857c-3.259 0-5.755 2.888-5.635 5.159-.247 3.28 2.397 5.984 5.635 5.984 2.012 0 3.888-1.065 4.895-2.781.503-.857-.791-1.613-1.293-.76-.739 1.259-2.12 2.041-3.602 2.041-2.187 0-3.965-1.668-4.125-3.771 1.443.017 4.136-.188 8.987-.033.016 0 .027-.008.042-.008 2-.09-.189-5.831-4.904-5.831zm-3.928 4.298c1.286-3.789 6.718-3.676 7.89.064-4.064.097-6.496-.066-7.89-.064z"/><path d="m21.308 6.464c.993 0 .992-1.5 0-1.5h-5.87c-.993 0-.992 1.5 0 1.5z"/></svg>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- header 11 end -->
|
|
|
|
|
|
|
|
|
|
<!-- hero 12 start -->
|
|
|
|
|
|
<section class="grid grid-cols-1 gap-0 bg-blue-100 dark:bg-gray-800 bg-opacity-25 md:grid-cols-2">
|
|
<div class="flex flex-col items-start justify-center px-4 py-24 lg:px-20">
|
|
<span class="mb-3 text-white bg-blue-900 dark:bg-emerald-400 rounded-xl text-sm px-2">Pre Beta</span>
|
|
<h1 class="mb-6 text-4xl font-bold leading-tight text-blue-900 dark:text-cyan-300 md:text-4xl lg:text-5xl">Great customer relationships start here.</h1>
|
|
<form class="w-full mb-6">
|
|
<label class="sr-only">Your Email</label>
|
|
|
|
<div class=" w-full form-append lg:flex">
|
|
<input class="text-black border-b-2 border-gray-800 dark:rounded dark:text-emerald-300 dark:placeholder:text-emerald-300 dark:bg-blue-900 outline-none p-1 " type="email" placeholder="Enter your email..." required="true" />
|
|
<button class=" rounded-lg p-1 sm:ml-3 mt-3 md:mt-0 text-white bg-blue-900 hover:bg-blue-800 dark:text-black dark:bg-emerald-400 hover:translate-x-1 transition duration-300" type="submit">Get Started</button>
|
|
</div>
|
|
</form>
|
|
<p class="pr-0 mb-4 text-sm text-blue-800 dark:text-cyan-300 tracking-relaxed lg:pr-16">Get the #1 Business Messenger and start delivering personalized experiences at every stage of the customer journey.</p>
|
|
</div>
|
|
<div>
|
|
<img
|
|
src="https://images.unsplash.com/photo-1531548731165-c6ae86ff6491?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=967&q=80"
|
|
alt="3 women looking at a laptop"
|
|
class="object-cover w-full h-64 bg-gray-100 md:h-full"
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- hero 12 end -->
|
|
|
|
|
|
<!-- feature 10 start -->
|
|
|
|
<section class="dark:bg-gray-800 dark:text-gray-100 py-24">
|
|
<div class="container max-w-xl p-6 py-12 mx-auto space-y-24 lg:px-8 lg:max-w-7xl">
|
|
<div>
|
|
<h2 class="text-3xl font-bold tracking-tight text-center sm:text-5xl dark:text-gray-50">Aliquip definiebas ad est</h2>
|
|
<p class="max-w-3xl mx-auto mt-4 text-xl text-center dark:text-gray-400">Quando cetero his ne, eum admodum sapientem ut.</p>
|
|
</div>
|
|
<div class="grid lg:gap-8 lg:grid-cols-2 lg:items-center">
|
|
<div>
|
|
<h3 class="text-2xl font-bold tracking-tight sm:text-3xl dark:text-gray-50">Ad vix debet docendi</h3>
|
|
<p class="mt-3 text-lg dark:text-gray-400">Ne dicta praesent ocurreret has, diam theophrastus at pro. Eos etiam regione ut, persius eripuit quo id. Sit te euismod tacimates.</p>
|
|
<div class="mt-12 space-y-12">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">Per ei quaeque sensibus</h4>
|
|
<p class="mt-2 dark:text-gray-400">Ex usu illum iudico molestie. Pro ne agam facete mediocritatem, ridens labore facete mea ei. Pro id apeirian dignissim.</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">Cu imperdiet posidonium sed</h4>
|
|
<p class="mt-2 dark:text-gray-400">Amet utinam aliquando ut mea, malis admodum ocurreret nec et, elit tibique cu nec. Nec ex maluisset inciderint, ex quis.</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">Nulla omittam sadipscing mel ne</h4>
|
|
<p class="mt-2 dark:text-gray-400">At sed possim oporteat probatus, justo graece ne nec, minim commodo legimus ut vix. Ut eos iudico quando soleat, nam modus.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div aria-hidden="true" class="mt-10 lg:mt-0">
|
|
<img src="https://source.unsplash.com/random/360x480" alt="" class="mx-auto rounded-lg shadow-lg dark:bg-gray-500">
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="grid lg:gap-8 lg:grid-cols-2 lg:items-center">
|
|
<div class="lg:col-start-2">
|
|
<h3 class="text-2xl font-bold tracking-tight sm:text-3xl dark:text-gray-50">Eam nibh gloriatur ex</h3>
|
|
<p class="mt-3 text-lg dark:text-gray-400">Per odio fabellas consulatu cu. Utroque detracto mel ea, quo te latine theophrastus. Ea his tale nibh dissentias, mei exerci tamquam euripidis cu.</p>
|
|
<div class="mt-12 space-y-12">
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">Cibo augue offendit has ad</h4>
|
|
<p class="mt-2 dark:text-gray-400">An per velit appellantur, ut utinam minimum nominavi sit, odio nostro habemus ne nec. Ne sonet regione contentiones est.</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">At eum ferri luptatum lobortis</h4>
|
|
<p class="mt-2 dark:text-gray-400">Te per quidam maiorum ocurreret, etiam delicatissimi usu ad. Ne has quod periculis. Te sit primis iisque efficiantur.</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex">
|
|
<div class="flex-shrink-0">
|
|
<div class="flex items-center justify-center w-12 h-12 rounded-md dark:bg-green-400 dark:text-gray-900">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" class="w-7 h-7">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="ml-4">
|
|
<h4 class="text-lg font-medium leading-6 dark:text-gray-50">Dicunt verterem evertitur eu sea</h4>
|
|
<p class="mt-2 dark:text-gray-400">Audire principes rationibus eam an, autem nominavi luptatum per te. Sumo fabulas vim eu, sonet saperet eleifend ut vix.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt-10 lg:mt-0 lg:col-start-1 lg:row-start-1">
|
|
<img src="https://source.unsplash.com/random/361x481" alt="" class="mx-auto rounded-lg shadow-lg dark:bg-gray-500">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- feature 10 end -->
|
|
|
|
|
|
<!-- pricing 3 start -->
|
|
|
|
<div class="relative w-full h-full bg-gray-50 dark:bg-gray-800">
|
|
<div class="relative px-4 py-16 mx-auto sm:max-w-xl md:max-w-full lg:max-w-screen-xl md:px-24 lg:px-8 lg:py-24">
|
|
<div class="max-w-xl mb-10 md:mx-auto sm:text-center lg:max-w-2xl md:mb-12">
|
|
<h2 class="max-w-lg mb-6 font-sans text-3xl font-bold leading-none tracking-tight text-gray-900 dark:text-emerald-300 sm:text-4xl md:mx-auto">
|
|
<span class="relative inline-block ">
|
|
<svg viewBox="0 0 52 24" fill="currentColor" class="absolute top-0 left-0 z-0 hidden w-32 -mt-8 -ml-20 text-gray-400 dark:text-white lg:w-32 lg:-ml-28 lg:-mt-10 sm:block">
|
|
<defs class="">
|
|
<pattern id="2c67e949-4a23-49f7-bf27-ca140852cf21" x="0" y="0" width=".135" height=".30">
|
|
<circle cx="1" cy="1" r=".7"></circle>
|
|
</pattern>
|
|
</defs>
|
|
<rect fill="url(#2c67e949-4a23-49f7-bf27-ca140852cf21)" width="52" height="24"></rect>
|
|
</svg>
|
|
<span class="relative dark:text-emerald-300">Affordable</span>
|
|
</span>
|
|
for everyone
|
|
</h2>
|
|
<p class="text-base text-gray-700 dark:text-gray-400 md:text-lg">
|
|
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque rem aperiam, eaque ipsa quae.
|
|
</p>
|
|
</div>
|
|
<div class="grid max-w-screen-md gap-10 md:grid-cols-2 sm:mx-auto">
|
|
<div>
|
|
<div class="p-8 bg-gray-900 rounded">
|
|
<div class="mb-4 text-center">
|
|
<p class="text-xl font-medium tracking-wide text-white">
|
|
Starter Plan
|
|
</p>
|
|
<div class="flex items-center justify-center">
|
|
<p class="mr-2 text-5xl font-semibold text-white lg:text-6xl">
|
|
$39
|
|
</p>
|
|
<p class="text-lg text-gray-500">/ month</p>
|
|
</div>
|
|
</div>
|
|
<ul class="mb-8 space-y-2">
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">10 deploys per day</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">10 GB of storage</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">3 domains</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">SSL Certificates</p>
|
|
</li>
|
|
</ul>
|
|
<button
|
|
type="submit"
|
|
class="inline-flex items-center justify-center w-full h-12 px-6 font-medium tracking-wide text-white transition duration-200 rounded shadow-md bg-purple-800 hover:bg-deep-purple-accent-700 focus:shadow-outline focus:outline-none"
|
|
>
|
|
Get Now
|
|
</button>
|
|
</div>
|
|
<div class="w-11/12 h-2 mx-auto bg-gray-900 rounded-b opacity-75"></div>
|
|
<div class="w-10/12 h-2 mx-auto bg-gray-900 rounded-b opacity-50"></div>
|
|
<div class="w-9/12 h-2 mx-auto bg-gray-900 rounded-b opacity-25"></div>
|
|
</div>
|
|
<div>
|
|
<div class="p-8 bg-gray-900 rounded">
|
|
<div class="mb-4 text-center">
|
|
<p class="text-xl font-medium tracking-wide text-white">Pro Plan</p>
|
|
<div class="flex items-center justify-center">
|
|
<p class="mr-2 text-5xl font-semibold text-white lg:text-6xl">
|
|
$59
|
|
</p>
|
|
<p class="text-lg text-gray-500">/ month</p>
|
|
</div>
|
|
</div>
|
|
<ul class="mb-8 space-y-2">
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">100 deploys per day</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">50 GB of storage</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">Unlimited domains</p>
|
|
</li>
|
|
<li class="flex items-center">
|
|
<div class="mr-3">
|
|
<svg class="w-4 h-4 text-teal-accent-400" viewBox="0 0 24 24" stroke-linecap="round" stroke-width="2">
|
|
<polyline fill="none" stroke="currentColor" points="6,12 10,16 18,8"></polyline>
|
|
<circle cx="12" cy="12" fill="none" r="11" stroke="currentColor"></circle>
|
|
</svg>
|
|
</div>
|
|
<p class="font-medium text-gray-300">SSL Certificates</p>
|
|
</li>
|
|
</ul>
|
|
<button
|
|
type="submit"
|
|
class="inline-flex items-center justify-center w-full h-12 px-6 font-semibold tracking-wide text-gray-900 transition duration-200 rounded shadow-md bg-teal-600 hover:bg-teal-accent-700 focus:shadow-outline focus:outline-none"
|
|
>
|
|
Get Now
|
|
</button>
|
|
</div>
|
|
<div class="w-11/12 h-2 mx-auto bg-gray-900 rounded-b opacity-75"></div>
|
|
<div class="w-10/12 h-2 mx-auto bg-gray-900 rounded-b opacity-50"></div>
|
|
<div class="w-9/12 h-2 mx-auto bg-gray-900 rounded-b opacity-25"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- pricing 3 end -->
|
|
|
|
|
|
<!-- contact 8 start -->
|
|
<section class="bg-white dark:bg-gray-800 lg:py-[120px] overflow-hidden relative z-10 ">
|
|
<div class="container mx-auto">
|
|
<div class="flex flex-wrap justify-center lg:justify-between ">
|
|
<div class="w-full lg:w-1/2 xl:w-6/12 px-4">
|
|
<div class="max-w-[570px] mb-12 lg:mb-0">
|
|
<span class="block mb-4 text-base dark:text-cyan-300 font-semibold">
|
|
Contact Us
|
|
</span>
|
|
<h2
|
|
class="
|
|
dark:text-cyan-300
|
|
mb-6
|
|
uppercase
|
|
font-bold
|
|
text-[32px]
|
|
sm:text-[40px]
|
|
lg:text-[36px]
|
|
xl:text-[40px]
|
|
"
|
|
>
|
|
GET IN TOUCH WITH US
|
|
</h2>
|
|
<p class="text-base dark:text-cyan-100 leading-relaxed mb-9">
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
|
|
eius tempor incididunt ut labore et dolore magna aliqua. Ut enim
|
|
adiqua minim veniam quis nostrud exercitation ullamco
|
|
</p>
|
|
<div class="flex mb-8 max-w-[370px] w-full">
|
|
<div
|
|
class="
|
|
max-w-[60px]
|
|
sm:max-w-[70px]
|
|
w-full
|
|
h-[60px]
|
|
sm:h-[70px]
|
|
flex
|
|
items-center
|
|
justify-center
|
|
mr-6
|
|
overflow-hidden
|
|
dark:text-cyan-300 bg-opacity-5
|
|
text-primary
|
|
rounded
|
|
"
|
|
>
|
|
<svg
|
|
width="24"
|
|
height="24"
|
|
viewBox="0 0 24 24"
|
|
class="fill-current"
|
|
>
|
|
<path
|
|
d="M21.8182 24H16.5584C15.3896 24 14.4156 23.0256 14.4156 21.8563V17.5688C14.4156 17.1401 14.0649 16.7893 13.6364 16.7893H10.4026C9.97403 16.7893 9.62338 17.1401 9.62338 17.5688V21.8173C9.62338 22.9866 8.64935 23.961 7.48052 23.961H2.14286C0.974026 23.961 0 22.9866 0 21.8173V8.21437C0 7.62972 0.311688 7.08404 0.818182 6.77223L11.1039 0.263094C11.6494 -0.0876979 12.3896 -0.0876979 12.9351 0.263094L23.2208 6.77223C23.7273 7.08404 24 7.62972 24 8.21437V21.7783C24 23.0256 23.026 24 21.8182 24ZM10.3636 15.4251H13.5974C14.7662 15.4251 15.7403 16.3995 15.7403 17.5688V21.8173C15.7403 22.246 16.0909 22.5968 16.5195 22.5968H21.8182C22.2468 22.5968 22.5974 22.246 22.5974 21.8173V8.25335C22.5974 8.13642 22.5195 8.01949 22.4416 7.94153L12.1948 1.4324C12.0779 1.35445 11.9221 1.35445 11.8442 1.4324L1.55844 7.94153C1.44156 8.01949 1.4026 8.13642 1.4026 8.25335V21.8563C1.4026 22.285 1.75325 22.6358 2.18182 22.6358H7.48052C7.90909 22.6358 8.25974 22.285 8.25974 21.8563V17.5688C8.22078 16.3995 9.19481 15.4251 10.3636 15.4251Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="w-full">
|
|
<h4 class="font-bold dark:text-cyan-300 text-xl mb-1">Our Location</h4>
|
|
<p class="text-base dark:text-cyan-100">
|
|
99 S.t Jomblo Park Pekanbaru 28292. Indonesia
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex mb-8 max-w-[370px] w-full">
|
|
<div
|
|
class="
|
|
max-w-[60px]
|
|
sm:max-w-[70px]
|
|
w-full
|
|
h-[60px]
|
|
sm:h-[70px]
|
|
flex
|
|
items-center
|
|
justify-center
|
|
mr-6
|
|
overflow-hidden
|
|
bg-primary bg-opacity-5
|
|
dark:text-cyan-300
|
|
rounded
|
|
"
|
|
>
|
|
<svg
|
|
width="24"
|
|
height="26"
|
|
viewBox="0 0 24 26"
|
|
class="fill-current "
|
|
>
|
|
<path
|
|
d="M22.6149 15.1386C22.5307 14.1704 21.7308 13.4968 20.7626 13.4968H2.82869C1.86042 13.4968 1.10265 14.2125 0.97636 15.1386L0.092295 23.9793C0.0501967 24.4845 0.21859 25.0317 0.555377 25.4106C0.892163 25.7895 1.39734 26 1.94462 26H21.6887C22.1939 26 22.6991 25.7895 23.078 25.4106C23.4148 25.0317 23.5832 24.5266 23.5411 23.9793L22.6149 15.1386ZM21.9413 24.4424C21.8992 24.4845 21.815 24.5687 21.6466 24.5687H1.94462C1.81833 24.5687 1.69203 24.4845 1.64993 24.4424C1.60783 24.4003 1.52364 24.3161 1.56574 24.1477L2.4498 15.2649C2.4498 15.0544 2.61819 14.9281 2.82869 14.9281H20.8047C21.0152 14.9281 21.1415 15.0544 21.1835 15.2649L22.0676 24.1477C22.0255 24.274 21.9834 24.4003 21.9413 24.4424Z"
|
|
/>
|
|
<path
|
|
d="M11.7965 16.7805C10.1547 16.7805 8.84961 18.0855 8.84961 19.7273C8.84961 21.3692 10.1547 22.6742 11.7965 22.6742C13.4383 22.6742 14.7434 21.3692 14.7434 19.7273C14.7434 18.0855 13.4383 16.7805 11.7965 16.7805ZM11.7965 21.2008C10.9966 21.2008 10.3231 20.5272 10.3231 19.7273C10.3231 18.9275 10.9966 18.2539 11.7965 18.2539C12.5964 18.2539 13.2699 18.9275 13.2699 19.7273C13.2699 20.5272 12.5964 21.2008 11.7965 21.2008Z"
|
|
/>
|
|
<path
|
|
d="M1.10265 7.85562C1.18684 9.70794 2.82868 10.4657 3.67064 10.4657H6.61752C6.65962 10.4657 6.65962 10.4657 6.65962 10.4657C7.92257 10.3815 9.18552 9.53955 9.18552 7.85562V6.84526C10.5748 6.84526 13.7742 6.84526 15.1635 6.84526V7.85562C15.1635 9.53955 16.4264 10.3815 17.6894 10.4657H17.7315H20.6363C21.4782 10.4657 23.1201 9.70794 23.2043 7.85562C23.2043 7.72932 23.2043 7.26624 23.2043 6.84526C23.2043 6.50847 23.2043 6.21378 23.2043 6.17169C23.2043 6.12959 23.2043 6.08749 23.2043 6.08749C23.078 4.90874 22.657 3.94047 21.9413 3.18271L21.8992 3.14061C20.8468 2.17235 19.5838 1.62507 18.6155 1.28828C15.795 0.193726 12.2587 0.193726 12.0903 0.193726C9.6065 0.235824 8.00677 0.446315 5.60716 1.28828C4.681 1.58297 3.41805 2.13025 2.36559 3.09851L2.3235 3.14061C1.60782 3.89838 1.18684 4.86664 1.06055 6.04539C1.06055 6.08749 1.06055 6.12959 1.06055 6.12959C1.06055 6.21378 1.06055 6.46637 1.06055 6.80316C1.10265 7.18204 1.10265 7.68722 1.10265 7.85562ZM3.37595 4.15097C4.21792 3.3932 5.27038 2.93012 6.15444 2.59333C8.34355 1.79346 9.7749 1.62507 12.1745 1.58297C12.3429 1.58297 15.6266 1.62507 18.1525 2.59333C19.0365 2.93012 20.089 3.3511 20.931 4.15097C21.394 4.65615 21.6887 5.32972 21.7729 6.12959C21.7729 6.25588 21.7729 6.46637 21.7729 6.80316C21.7729 7.22414 21.7729 7.68722 21.7729 7.81352C21.7308 8.78178 20.8047 8.99227 20.6784 8.99227H17.7736C17.3526 8.95017 16.679 8.78178 16.679 7.85562V6.12959C16.679 5.7928 16.4685 5.54021 16.1738 5.41392C15.9213 5.32972 8.55405 5.32972 8.30146 5.41392C8.00677 5.49811 7.79628 5.7928 7.79628 6.12959V7.85562C7.79628 8.78178 7.1227 8.95017 6.70172 8.99227H3.79694C3.67064 8.99227 2.74448 8.78178 2.70238 7.81352C2.70238 7.68722 2.70238 7.22414 2.70238 6.80316C2.70238 6.46637 2.70238 6.29798 2.70238 6.17169C2.61818 5.32972 2.91287 4.65615 3.37595 4.15097Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="w-full">
|
|
<h4 class="font-bold dark:text-cyan-300 text-xl mb-1">Phone Number</h4>
|
|
<p class="text-base dark:text-cyan-100">(+62)81 414 257 9980</p>
|
|
</div>
|
|
</div>
|
|
<div class="flex mb-8 max-w-[370px] w-full">
|
|
<div
|
|
class="
|
|
max-w-[60px]
|
|
sm:max-w-[70px]
|
|
w-full
|
|
h-[60px]
|
|
sm:h-[70px]
|
|
flex
|
|
items-center
|
|
justify-center
|
|
mr-6
|
|
overflow-hidden
|
|
dark:text-cyan-300 bg-opacity-5
|
|
text-primary
|
|
rounded
|
|
"
|
|
>
|
|
<svg
|
|
width="28"
|
|
height="19"
|
|
viewBox="0 0 28 19"
|
|
class="fill-current"
|
|
>
|
|
<path
|
|
d="M25.3636 0H2.63636C1.18182 0 0 1.16785 0 2.6052V16.3948C0 17.8322 1.18182 19 2.63636 19H25.3636C26.8182 19 28 17.8322 28 16.3948V2.6052C28 1.16785 26.8182 0 25.3636 0ZM25.3636 1.5721C25.5909 1.5721 25.7727 1.61702 25.9545 1.75177L14.6364 8.53428C14.2273 8.75886 13.7727 8.75886 13.3636 8.53428L2.04545 1.75177C2.22727 1.66194 2.40909 1.5721 2.63636 1.5721H25.3636ZM25.3636 17.383H2.63636C2.09091 17.383 1.59091 16.9338 1.59091 16.3499V3.32388L12.5 9.8818C12.9545 10.1513 13.4545 10.2861 13.9545 10.2861C14.4545 10.2861 14.9545 10.1513 15.4091 9.8818L26.3182 3.32388V16.3499C26.4091 16.9338 25.9091 17.383 25.3636 17.383Z"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
<div class="w-full">
|
|
<h4 class="font-bold dark:text-cyan-300 text-xl mb-1">
|
|
Email Address
|
|
</h4>
|
|
<p class="text-base dark:text-cyan-100">info@yourdomain.com</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="w-full lg:w-1/2 xl:w-5/12 px-4">
|
|
<div class="bg-white dark:bg-gray-800 dark:border-2 dark:border-cyan-300 relative rounded-lg p-8 sm:p-12 shadow-lg">
|
|
<form>
|
|
<div class="mb-6">
|
|
<input
|
|
type="text"
|
|
placeholder="Your Name"
|
|
class="
|
|
w-full
|
|
rounded
|
|
py-3
|
|
px-[14px]
|
|
text-body-color text-base
|
|
border border-[f0f0f0]
|
|
outline-none
|
|
focus-visible:shadow-none
|
|
focus:border-primary
|
|
"
|
|
/>
|
|
</div>
|
|
<div class="mb-6">
|
|
<input
|
|
type="email"
|
|
placeholder="Your Email"
|
|
class="
|
|
w-full
|
|
rounded
|
|
py-3
|
|
px-[14px]
|
|
text-body-color text-base
|
|
border border-[f0f0f0]
|
|
outline-none
|
|
focus-visible:shadow-none
|
|
focus:border-primary
|
|
"
|
|
/>
|
|
</div>
|
|
<div class="mb-6">
|
|
<input
|
|
type="text"
|
|
placeholder="Your Phone"
|
|
class="
|
|
w-full
|
|
rounded
|
|
py-3
|
|
px-[14px]
|
|
text-body-color text-base
|
|
border border-[f0f0f0]
|
|
outline-none
|
|
focus-visible:shadow-none
|
|
focus:border-primary
|
|
"
|
|
/>
|
|
</div>
|
|
<div class="mb-6">
|
|
<textarea
|
|
rows="6"
|
|
placeholder="Your Message"
|
|
class="
|
|
w-full
|
|
rounded
|
|
py-3
|
|
px-[14px]
|
|
text-body-color text-base
|
|
border border-[f0f0f0]
|
|
resize-none
|
|
outline-none
|
|
focus-visible:shadow-none
|
|
focus:border-primary
|
|
"
|
|
></textarea>
|
|
</div>
|
|
<div>
|
|
<button
|
|
type="submit"
|
|
class="
|
|
w-full
|
|
text-white
|
|
bg-primary
|
|
rounded
|
|
border border-primary
|
|
p-3
|
|
transition
|
|
hover:bg-opacity-90
|
|
"
|
|
>
|
|
Send Message
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<div>
|
|
<span class="absolute -top-10 -right-9 z-[-1]">
|
|
<svg
|
|
width="100"
|
|
height="100"
|
|
viewBox="0 0 100 100"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
fill-rule="evenodd"
|
|
clip-rule="evenodd"
|
|
d="M0 100C0 44.7715 0 0 0 0C55.2285 0 100 44.7715 100 100C100 100 100 100 0 100Z"
|
|
fill="#3056D3"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
<span class="absolute -right-10 top-[90px] z-[-1]">
|
|
<svg
|
|
width="34"
|
|
height="134"
|
|
viewBox="0 0 34 134"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
<span class="absolute -left-7 -bottom-7 z-[-1]">
|
|
<svg
|
|
width="107"
|
|
height="134"
|
|
viewBox="0 0 107 134"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<circle
|
|
cx="104.999"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="104.999"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 104.999 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="90.3333"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 90.3333 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="75.6654"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 75.6654 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="31.9993"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 31.9993 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="60.9993"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 60.9993 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="17.3333"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 17.3333 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="132"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 132)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="117.333"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 117.333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="102.667"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 102.667)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="88"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 88)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="73.3333"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 73.3333)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="45"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 45)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="16"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 16)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="59"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 59)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="30.6666"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 30.6666)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="46.3333"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 46.3333 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
<circle
|
|
cx="2.66536"
|
|
cy="1.66665"
|
|
r="1.66667"
|
|
transform="rotate(180 2.66536 1.66665)"
|
|
fill="#13C296"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- contact 8 end -->
|
|
|
|
|
|
|
|
<!--footer 2 start-->
|
|
|
|
<section class="flex items-end w-full bg-white dark:bg-gray-800 drop-shadow-lg ">
|
|
|
|
<footer class="w-full text-gray-700 bg-gray-100 dark:bg-gray-800 body-font">
|
|
<div
|
|
class="container flex flex-col flex-wrap px-5 py-24 mx-auto md:items-center lg:items-start md:flex-row md:flex-no-wrap">
|
|
<div class="flex-shrink-0 w-64 mx-auto text-center md:mx-0 md:text-left">
|
|
<a class="flex items-center justify-center font-medium text-gray-900 title-font md:justify-start">
|
|
<svg class="w-auto h-5 text-gray-900 dark:text-sky-300 fill-current" viewBox="0 0 202 69"
|
|
xmlns="http://www.w3.org/2000/svg">
|
|
<path
|
|
d="M57.44.672s6.656 1.872 6.656 5.72c0 0-1.56 2.6-3.744 6.552 8.424 1.248 16.744 1.248 23.816-1.976-1.352 7.904-12.688 8.008-26.208 6.136-7.696 13.624-19.656 36.192-19.656 42.848 0 .416.208.624.52.624 4.576 0 17.888-14.352 21.112-18.824 1.144-1.456 4.264.728 3.12 2.392C56.608 53.088 42.152 69 36.432 69c-4.472 0-8.216-5.928-8.216-10.4 0-6.552 11.752-28.08 20.28-42.952-9.984-1.664-20.176-3.64-27.976-3.848-13.936 0-16.64 3.536-17.576 6.032-.104.312-.52.52-.832.312-3.744-7.072-1.456-14.56 14.144-14.56 9.36 0 22.048 4.576 34.944 7.592C54.736 5.04 57.44.672 57.44.672zm46.124 41.08c1.144-1.456 4.264.728 3.016 2.392C100.236 53.088 85.78 69 80.06 69c-4.576 0-8.32-5.928-8.32-10.4v-.208C67.58 64.32 63.524 69 61.34 69c-4.472 0-8.944-4.992-8.944-11.856 0-10.608 15.704-33.072 24.96-33.072 4.992 0 7.384 2.392 8.528 4.576l2.6-4.576s6.656 1.976 6.656 5.824c0 0-13.312 24.336-13.312 30.056 0 .208 0 .624.52.624 4.472 0 17.888-14.352 21.216-18.824zm-40.56 18.72c2.184 0 11.752-13.312 17.368-22.048l4.16-7.488c-8.008-7.904-27.248 29.536-21.528 29.536zm57.564-38.168c-2.184 0-4.992-2.808-4.992-4.784 0-2.912 5.824-14.872 7.28-14.872 2.6 0 6.136 2.808 6.136 6.344 0 2.08-7.176 12.064-8.424 13.312zm-17.68 46.592c-4.472 0-8.216-5.928-8.216-10.4 0-6.656 16.744-34.528 16.744-34.528s6.552 1.976 6.552 5.824c0 0-13.312 24.336-13.312 30.056 0 .208.104.624.624.624 4.472 0 17.888-14.352 21.112-18.824 1.144-1.456 4.264.728 3.12 2.392-6.448 8.944-20.904 24.856-26.624 24.856zM147.244.672s6.656 1.872 6.656 5.72c0 0-25.792 43.784-25.792 53.56 0 .416.208.624.52.624 4.576 0 17.888-14.352 21.112-18.824 1.144-1.456 4.264.728 3.12 2.392C146.412 53.088 131.956 69 126.236 69c-4.472 0-8.216-5.928-8.216-10.4 0-10.4 29.224-57.928 29.224-57.928zM169.7 60.16c3.848-2.392 7.904-6.864 10.816-10.92 6.656-9.464 11.544-20.696 10.504-27.352-.312-3.432-.104-4.056 3.12-2.704 5.2 2.392 11.336 8.632 2.184 22.88-5.2 8.008-12.48 15.288-19.344 19.76-2.704 1.768-6.344 3.328-9.984 4.16-.52.416-1.04.728-1.456.936-1.872 1.352-4.264 2.08-7.592 2.08-14.664 0-16.848-12.272-16.848-16.016 0-2.392 3.224-4.68 4.784-3.744.208.104.312.416.312.624 0 2.808 1.872 13.104 9.984 13.104 7.904 0 3.432-18.304 2.288-27.144-1.456 2.288-3.432 4.992-5.616 8.32-2.6 3.744-5.72 1.456-4.784 0 5.824-8.424 9.152-13.832 11.856-18.616 1.248-2.08 3.328-3.328 6.448-3.328 2.704 0 5.824 3.016 6.864 4.784.312.52 0 1.04-.52 1.144a5.44 5.44 0 00-4.368 5.408c0 6.968 2.6 17.16 1.664 24.856l-.312 1.768z"
|
|
fill-rule="nonzero" /></svg>
|
|
</a>
|
|
<p class="mt-2 text-sm text-gray-500 dark:text-gray-300">Design, Code and Ship!</p>
|
|
<div class="mt-4">
|
|
<span class="inline-flex justify-center mt-2 sm:ml-auto sm:mt-0 sm:justify-start">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-700 dark:text-gray-300 dark:hover:text-sky-300">
|
|
<svg fill="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
class="w-5 h-5" viewBox="0 0 24 24">
|
|
<path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"></path>
|
|
</svg>
|
|
</a>
|
|
<a class="ml-3 text-gray-500 cursor-pointer hover:text-gray-700 dark:text-gray-300 dark:hover:text-sky-300">
|
|
<svg fill="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
class="w-5 h-5" viewBox="0 0 24 24">
|
|
<path
|
|
d="M23 3a10.9 10.9 0 01-3.14 1.53 4.48 4.48 0 00-7.86 3v1A10.66 10.66 0 013 4s-4 9 5 13a11.64 11.64 0 01-7 2c9 5 20 0 20-11.5a4.5 4.5 0 00-.08-.83A7.72 7.72 0 0023 3z">
|
|
</path>
|
|
</svg>
|
|
</a>
|
|
<a class="ml-3 text-gray-500 cursor-pointer hover:text-gray-700 dark:text-gray-300 dark:hover:text-sky-300">
|
|
<svg fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
|
|
stroke-width="2" class="w-5 h-5" viewBox="0 0 24 24">
|
|
<rect width="20" height="20" x="2" y="2" rx="5" ry="5"></rect>
|
|
<path d="M16 11.37A4 4 0 1112.63 8 4 4 0 0116 11.37zm1.5-4.87h.01"></path>
|
|
</svg>
|
|
</a>
|
|
<a class="ml-3 text-gray-500 cursor-pointer hover:text-gray-700 dark:text-gray-300 dark:hover:text-sky-300">
|
|
<svg fill="currentColor" stroke="currentColor" stroke-linecap="round"
|
|
stroke-linejoin="round" stroke-width="0" class="w-5 h-5" viewBox="0 0 24 24">
|
|
<path stroke="none"
|
|
d="M16 8a6 6 0 016 6v7h-4v-7a2 2 0 00-2-2 2 2 0 00-2 2v7h-4v-7a6 6 0 016-6zM2 9h4v12H2z">
|
|
</path>
|
|
<circle cx="4" cy="4" r="2" stroke="none"></circle>
|
|
</svg>
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-wrap flex-grow mt-10 -mb-10 text-center md:pl-20 md:mt-0 md:text-left">
|
|
<div class="w-full px-4 lg:w-1/4 md:w-1/2">
|
|
<h2 class="mb-3 text-sm font-medium tracking-widest text-gray-900 uppercase title-font dark:text-sky-300">About</h2>
|
|
<nav class="mb-10 list-none">
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Company</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Careers</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Blog</a>
|
|
</li>
|
|
</nav>
|
|
</div>
|
|
<div class="w-full px-4 lg:w-1/4 md:w-1/2">
|
|
<h2 class="mb-3 text-sm font-medium tracking-widest text-gray-900 dark:text-sky-300 uppercase title-font">Support</h2>
|
|
<nav class="mb-10 list-none">
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Contact Support</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Help Resources</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Release Updates</a>
|
|
</li>
|
|
</nav>
|
|
</div>
|
|
<div class="w-full px-4 lg:w-1/4 md:w-1/2">
|
|
<h2 class="mb-3 text-sm font-medium tracking-widest text-gray-900 uppercase title-font dark:text-sky-300">Platform
|
|
</h2>
|
|
<nav class="mb-10 list-none">
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Terms & Privacy</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Pricing</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">FAQ</a>
|
|
</li>
|
|
</nav>
|
|
</div>
|
|
<div class="w-full px-4 lg:w-1/4 md:w-1/2">
|
|
<h2 class="mb-3 text-sm font-medium tracking-widest text-gray-900 uppercase title-font dark:text-sky-300">Contact</h2>
|
|
<nav class="mb-10 list-none">
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Send a Message</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">Request a Quote</a>
|
|
</li>
|
|
<li class="mt-3">
|
|
<a class="text-gray-500 cursor-pointer hover:text-gray-900 dark:text-gray-300 dark:hover:text-sky-300">+123-456-7890</a>
|
|
</li>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="bg-gray-300 dark:bg-gray-700">
|
|
<div class="container px-5 py-4 mx-auto">
|
|
<p class="text-sm text-gray-700 dark:text-white capitalize xl:text-center">© 2020 All rights reserved </p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
|
|
</section>
|
|
<!--footer 2 end-->
|
|
|
|
|
|
|
|
<!-- start of script section -->
|
|
<script type="text/javascript">
|
|
let toogler = document.getElementById("dark_mood_toogler");
|
|
let doc_html_el = document.getElementsByTagName('html')[0];
|
|
|
|
doc_html_el.addEventListener('keyup',(e)=>{
|
|
// key 220 is the backward slash , need to press ctrl+ \ to activate or deactivate darkmode
|
|
if(e.ctrlKey && e.keyCode =='220'){
|
|
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
|
|
|
|
}
|
|
})
|
|
doc_html_el.addEventListener('keyup',(e)=>{
|
|
// key 191 is the forward slash , need to press ctrl+ / to show or hide the darkmode button
|
|
if(e.ctrlKey && e.keyCode =='191'){
|
|
toogler.style.display =='block'? toogler.style.display = 'none':toogler.style.display ='block';
|
|
|
|
}
|
|
})
|
|
toogler.addEventListener('click',()=>{
|
|
doc_html_el.className =='' ? doc_html_el.classList.add('dark'):doc_html_el.classList.remove('dark');
|
|
console.log(doc_html_el.className);
|
|
})
|
|
</script>
|
|
<!-- end of script section -->
|
|
|
|
|
|
</body>
|
|
</html> |