This repository has been archived on 2025-06-11. You can view files and clone it, but cannot push or open issues or pull requests.
www_ow_freezone/templates/partials/benefits.html
sasha-astiadi 2c529632c1
Some checks are pending
www2.ourworld.tf / Deploy (push) Waiting to run
make new
2024-10-23 17:35:42 +02:00

58 lines
2.3 KiB
HTML

<!-- Hero Section -->
<div class="relative bg-white">
<div class="mx-auto max-w-7xl px-4 grid grid-cols-1 lg:grid-cols-2 gap-4 lg:gap-8 items-start py-12">
<!-- Left Column (Image Section) -->
<div class="relative overflow-hidden lg:h-full">
<div class="image-container">
<img class="object-cover w-full h-full rounded-md mx-1" src="/images/benefits.webp" alt="Image description">
</div>
</div>
<!-- Right Column (Text Section) -->
<div class="relative sm:py-24 lg:py-12 lg:px-8 px-4">
<div class="max-w-xl mx-auto">
<h2 class="text-base font-semibold leading-7 text-blue-600">BENEFITS</h2>
<p class="mt-2 text-3xl font-bold tracking-tight text-black sm:text-4xl">✅ Simple. Streamlined.</p>
<div class="mt-4 font-light text-lg leading-7 tracking-tight text-gray-600">
<p class="text-base font-light lg:text-xl text-gray-600 mb-10 mt-6">For the entrepreneur, the digital nomad, or any company, we provide a revolutionary platform where you can obtain a digital company license, a bank account supporting both fiat and cryptocurrencies, and handle your legal requirements and taxes, all within a single, streamlined platform. <br><br>
Say goodbye to complexities and hello to a new era of simplicity and efficiency, empowering your business to thrive like never before.
</p>
</div>
<div class="mt-10 flex lg:gap-x-6 gap-x-3">
<a href="/about" class="rounded-xl bg-blue-700 px-4 py-2.5 lg:text-base text-sm font-semibold text-white shadow-sm hover:bg-blue-800 hover:text-blue-200 transition-colors duration-300">
Get Started
</a>
<a href="/about" class="rounded-xl border border-gray-800 border-r-2 px-4 py-2.5 font-medium text-gray-900 bg-transparent hover:bg-white hover:text-blue-700 transition-all duration-300">
Learn More &#8594;
</a>
</div>
</div>
</div>
</div>
</div>
<style>
.image-container {
position: relative;
left: 0;
width: 90%;
height: 90%;
}
.image-container::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 90%;
height: 90%;
}
/* Reset margin and padding for the entire page if needed */
body, html {
margin: 0;
padding: 0;
}
</style>