mirror of
https://git.kh3group.com/georgebiri/kh3_website.git
synced 2026-10-25 01:45:02 +00:00
Compare commits
No commits in common. "6746f1de777fafa6076513806ba40d062caa4751" and "8f3685cdb7725b09e5a717b4e61d9d298cde8218" have entirely different histories.
6746f1de77
...
8f3685cdb7
1 changed files with 72 additions and 72 deletions
144
about.html
144
about.html
|
|
@ -588,70 +588,6 @@
|
||||||
<section class="py-32 bg-kh3-grey text-kh3-black mission-vision">
|
<section class="py-32 bg-kh3-grey text-kh3-black mission-vision">
|
||||||
<div class="container mx-auto px-8 max-w-7xl">
|
<div class="container mx-auto px-8 max-w-7xl">
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 lg:gap-24">
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16 lg:gap-24">
|
||||||
<!-- Vision Card -->
|
|
||||||
<div class="relative group">
|
|
||||||
<!-- Decorative elements -->
|
|
||||||
<div
|
|
||||||
class="absolute -top-4 -left-4 w-8 h-8 bg-kh3-red opacity-0 group-hover:opacity-100 transition-opacity duration-300"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="absolute -bottom-4 -right-4 w-8 h-8 bg-kh3-red opacity-0 group-hover:opacity-100 transition-opacity duration-300"
|
|
||||||
></div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="relative bg-kh3-black p-12 rounded-2xl shadow-2xl hover:shadow-3xl transition-all duration-500 transform hover:-translate-y-3 hover:scale-105 overflow-hidden group animate-logo-float"
|
|
||||||
>
|
|
||||||
<!-- Glossy overlay -->
|
|
||||||
<div
|
|
||||||
class="absolute inset-0 bg-gradient-to-br from-white/5 via-transparent to-black/20 rounded-2xl"
|
|
||||||
></div>
|
|
||||||
|
|
||||||
<!-- Animated border glow -->
|
|
||||||
<div
|
|
||||||
class="absolute inset-0 rounded-2xl bg-gradient-to-r from-kh3-red/20 via-transparent to-kh3-red/20 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
|
|
||||||
></div>
|
|
||||||
|
|
||||||
<!-- Floating particles -->
|
|
||||||
<div
|
|
||||||
class="absolute top-6 left-4 w-1.5 h-1.5 bg-kh3-red/50 rounded-full animate-pulse"
|
|
||||||
></div>
|
|
||||||
<div
|
|
||||||
class="absolute bottom-4 right-6 w-1 h-1 bg-kh3-red/30 rounded-full animate-ping"
|
|
||||||
></div>
|
|
||||||
|
|
||||||
<div class="relative text-center">
|
|
||||||
<!-- Icon/Number with glow -->
|
|
||||||
<div
|
|
||||||
class="w-16 h-16 bg-gradient-to-br from-kh3-red to-red-700 rounded-full flex items-center justify-center mx-auto mb-8 shadow-lg group-hover:shadow-red-500/50 transition-all duration-300 transform group-hover:scale-110"
|
|
||||||
>
|
|
||||||
<span class="text-white text-2xl font-bold drop-shadow-lg"
|
|
||||||
>02</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Title with text glow -->
|
|
||||||
<h2
|
|
||||||
class="text-4xl md:text-5xl font-bold mb-8 text-white drop-shadow-lg group-hover:text-shadow-lg transition-all duration-300"
|
|
||||||
>
|
|
||||||
VISION
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<!-- Animated divider -->
|
|
||||||
<div
|
|
||||||
class="w-20 h-1 bg-gradient-to-r from-transparent via-kh3-red to-transparent mx-auto mb-8 group-hover:w-32 transition-all duration-500"
|
|
||||||
></div>
|
|
||||||
|
|
||||||
<!-- Content with hover effect -->
|
|
||||||
<p
|
|
||||||
class="text-xl md:text-2xl font-semibold text-kh3-red leading-relaxed group-hover:text-red-400 transition-all duration-300"
|
|
||||||
>
|
|
||||||
We will be the standard of global business excellence in
|
|
||||||
Africa.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Mission Card -->
|
<!-- Mission Card -->
|
||||||
<div class="relative group">
|
<div class="relative group">
|
||||||
<!-- Decorative elements -->
|
<!-- Decorative elements -->
|
||||||
|
|
@ -672,15 +608,15 @@
|
||||||
|
|
||||||
<!-- Animated border glow -->
|
<!-- Animated border glow -->
|
||||||
<div
|
<div
|
||||||
class="absolute inset-0 rounded-2xl bg-gradient-to-r from-kh3-red/20 via-transparent to-kh3-red/20 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
|
class="absolute inset-0 rounded-2xl bg-gradient-to-r from-kh3-red/20 via-transparent to-kh3-red/20 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
|
||||||
></div>
|
></div>
|
||||||
|
|
||||||
<!-- Floating particles -->
|
<!-- Floating particles -->
|
||||||
<div
|
<div
|
||||||
class="absolute top-4 right-4 w-2 h-2 bg-kh3-red/60 rounded-full animate-pulse"
|
class="absolute top-4 right-4 w-2 h-2 bg-kh3-red/60 rounded-full animate-pulse"
|
||||||
></div>
|
></div>
|
||||||
<div
|
<div
|
||||||
class="absolute bottom-6 left-6 w-1 h-1 bg-kh3-red/40 rounded-full animate-ping"
|
class="absolute bottom-6 left-6 w-1 h-1 bg-kh3-red/40 rounded-full animate-ping"
|
||||||
></div>
|
></div>
|
||||||
|
|
||||||
<div class="relative text-center">
|
<div class="relative text-center">
|
||||||
|
|
@ -711,6 +647,70 @@
|
||||||
>
|
>
|
||||||
Out of the ordinary the Extraordinary that inspires the
|
Out of the ordinary the Extraordinary that inspires the
|
||||||
world.
|
world.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Vision Card -->
|
||||||
|
<div class="relative group">
|
||||||
|
<!-- Decorative elements -->
|
||||||
|
<div
|
||||||
|
class="absolute -top-4 -left-4 w-8 h-8 bg-kh3-red opacity-0 group-hover:opacity-100 transition-opacity duration-300"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
class="absolute -bottom-4 -right-4 w-8 h-8 bg-kh3-red opacity-0 group-hover:opacity-100 transition-opacity duration-300"
|
||||||
|
></div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="relative bg-kh3-black p-12 rounded-2xl shadow-2xl hover:shadow-3xl transition-all duration-500 transform hover:-translate-y-3 hover:scale-105 overflow-hidden group animate-logo-float"
|
||||||
|
>
|
||||||
|
<!-- Glossy overlay -->
|
||||||
|
<div
|
||||||
|
class="absolute inset-0 bg-gradient-to-br from-white/5 via-transparent to-black/20 rounded-2xl"
|
||||||
|
></div>
|
||||||
|
|
||||||
|
<!-- Animated border glow -->
|
||||||
|
<div
|
||||||
|
class="absolute inset-0 rounded-2xl bg-gradient-to-r from-kh3-red/20 via-transparent to-kh3-red/20 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
|
||||||
|
></div>
|
||||||
|
|
||||||
|
<!-- Floating particles -->
|
||||||
|
<div
|
||||||
|
class="absolute top-6 left-4 w-1.5 h-1.5 bg-kh3-red/50 rounded-full animate-pulse"
|
||||||
|
></div>
|
||||||
|
<div
|
||||||
|
class="absolute bottom-4 right-6 w-1 h-1 bg-kh3-red/30 rounded-full animate-ping"
|
||||||
|
></div>
|
||||||
|
|
||||||
|
<div class="relative text-center">
|
||||||
|
<!-- Icon/Number with glow -->
|
||||||
|
<div
|
||||||
|
class="w-16 h-16 bg-gradient-to-br from-kh3-red to-red-700 rounded-full flex items-center justify-center mx-auto mb-8 shadow-lg group-hover:shadow-red-500/50 transition-all duration-300 transform group-hover:scale-110"
|
||||||
|
>
|
||||||
|
<span class="text-white text-2xl font-bold drop-shadow-lg"
|
||||||
|
>02</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Title with text glow -->
|
||||||
|
<h2
|
||||||
|
class="text-4xl md:text-5xl font-bold mb-8 text-white drop-shadow-lg group-hover:text-shadow-lg transition-all duration-300"
|
||||||
|
>
|
||||||
|
VISION
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<!-- Animated divider -->
|
||||||
|
<div
|
||||||
|
class="w-20 h-1 bg-gradient-to-r from-transparent via-kh3-red to-transparent mx-auto mb-8 group-hover:w-32 transition-all duration-500"
|
||||||
|
></div>
|
||||||
|
|
||||||
|
<!-- Content with hover effect -->
|
||||||
|
<p
|
||||||
|
class="text-xl md:text-2xl font-semibold text-kh3-red leading-relaxed group-hover:text-red-400 transition-all duration-300"
|
||||||
|
>
|
||||||
|
We will be the standard of global business excellence in
|
||||||
|
Africa.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -767,15 +767,15 @@
|
||||||
<h3
|
<h3
|
||||||
class="text-2xl font-semibold mb-6 transition-all duration-300 group-hover:text-kh3-red group-hover:scale-105"
|
class="text-2xl font-semibold mb-6 transition-all duration-300 group-hover:text-kh3-red group-hover:scale-105"
|
||||||
>
|
>
|
||||||
Innovation
|
Integrity
|
||||||
</h3>
|
</h3>
|
||||||
<p
|
<p
|
||||||
class="text-lg text-neutral-600 leading-relaxed transition-all duration-300 group-hover:text-neutral-800"
|
class="text-lg text-neutral-600 leading-relaxed transition-all duration-300 group-hover:text-neutral-800"
|
||||||
>
|
>
|
||||||
we challenge the status quo. We seek better, smarter and more
|
We stay true to our word. We will do what we say we will do, and
|
||||||
beautiful ways to solve problems and deliver value. When ideas
|
deliver on our promises. If forfeiting on our word is beyond our
|
||||||
fall short, we learn, adapt and try again- never settling,
|
human control; we will communicate this transparently and in
|
||||||
always solving
|
good time.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue