mirror of
https://git.kh3group.com/georgebiri/kh3_website.git
synced 2026-10-16 19:31:47 +00:00
Initial commit: KH3 Group Limited website with enhanced animations and slide+zoom transitions
This commit is contained in:
commit
ecebd00021
23 changed files with 5879 additions and 0 deletions
320
project-accra-corporate-tower.html
Normal file
320
project-accra-corporate-tower.html
Normal file
|
|
@ -0,0 +1,320 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Accra Corporate Tower - KH3 | Building Inspiring Spaces</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="A state-of-the-art corporate headquarters featuring modern workspace design, sustainable materials, and cutting-edge technology integration."
|
||||
/>
|
||||
<link rel="stylesheet" href="css/style.css" />
|
||||
<link rel="stylesheet" href="css/animations.css" />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="dark-gothic-mode">
|
||||
<!-- Navigation Menu Overlay -->
|
||||
<nav class="nav-overlay" id="navOverlay">
|
||||
<div class="nav-content">
|
||||
<div class="nav-header">
|
||||
<div class="logo">
|
||||
<img src="images/kh3_logo.png" alt="KH3" class="logo-image" />
|
||||
<span class="logo-text">KH3</span>
|
||||
</div>
|
||||
<button class="nav-close" id="navClose">
|
||||
<span></span>
|
||||
<span></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="nav-links">
|
||||
<a href="index.html">Home</a>
|
||||
<a href="about.html">About</a>
|
||||
<a href="projects.html">Projects</a>
|
||||
<a href="services.html">Services</a>
|
||||
<a href="approach.html">Approach</a>
|
||||
<a href="careers.html">Careers</a>
|
||||
<a href="news.html">News</a>
|
||||
<a href="brands.html">Brands</a>
|
||||
<a href="contact.html">Contact</a>
|
||||
</div>
|
||||
<div class="nav-footer">
|
||||
<div class="contact-info">
|
||||
<p>Accra, Ghana</p>
|
||||
<p>+233 20 123 4567</p>
|
||||
<p>info@kh3.com</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Page Header -->
|
||||
<header class="page-header">
|
||||
<div class="container">
|
||||
<div class="header-content">
|
||||
<div class="logo">
|
||||
<img src="images/kh3_logo.png" alt="KH3" class="logo-image" />
|
||||
<span class="logo-text">KH3</span>
|
||||
</div>
|
||||
<div class="menu-toggle" id="menuToggle">
|
||||
<div class="grid-icon">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- Main Content -->
|
||||
<main class="project-detail-main">
|
||||
<!-- Project Hero -->
|
||||
<section class="project-hero">
|
||||
<div class="container">
|
||||
<div class="project-hero-content">
|
||||
<div class="project-hero-text">
|
||||
<div class="project-category">Corporate</div>
|
||||
<h1 class="project-title">Accra Corporate Tower</h1>
|
||||
<p class="project-location">Accra, Ghana</p>
|
||||
</div>
|
||||
<div class="project-hero-image">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-cover.jpg"
|
||||
alt="Accra Corporate Tower"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Project Content -->
|
||||
<section class="project-content">
|
||||
<div class="container">
|
||||
<div class="project-layout">
|
||||
<!-- Project Meta Panel -->
|
||||
<aside class="project-meta-panel">
|
||||
<div class="meta-panel-content">
|
||||
<h3>Project Details</h3>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Type</span>
|
||||
<span class="meta-value">Corporate</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Client</span>
|
||||
<span class="meta-value"
|
||||
>Ghana Investment Promotion Centre</span
|
||||
>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Project Location</span>
|
||||
<span class="meta-value">Accra, Ghana</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Type of Work</span>
|
||||
<span class="meta-value">Turnkey Design & Fit-out</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Size</span>
|
||||
<span class="meta-value">2,500 sq m</span>
|
||||
</div>
|
||||
<div class="meta-item">
|
||||
<span class="meta-label">Year</span>
|
||||
<span class="meta-value">2023</span>
|
||||
</div>
|
||||
<div class="meta-cta">
|
||||
<a href="contact.html" class="btn-primary"
|
||||
>Start a Similar Project</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- Project Body -->
|
||||
<div class="project-body">
|
||||
<div class="project-summary">
|
||||
<h2>Project Overview</h2>
|
||||
<p>
|
||||
A state-of-the-art corporate headquarters featuring modern
|
||||
workspace design, sustainable materials, and cutting-edge
|
||||
technology integration.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="project-story">
|
||||
<div class="story-section">
|
||||
<h3>The Challenge</h3>
|
||||
<p>
|
||||
Create a prestigious corporate environment that reflects
|
||||
Ghana's economic growth while incorporating sustainable
|
||||
design principles.
|
||||
</p>
|
||||
</div>
|
||||
<div class="story-section">
|
||||
<h3>Our Approach</h3>
|
||||
<p>
|
||||
Implemented modular workspace design with natural lighting,
|
||||
local materials, and flexible meeting spaces.
|
||||
</p>
|
||||
</div>
|
||||
<div class="story-section">
|
||||
<h3>The Outcome</h3>
|
||||
<p>
|
||||
Delivered a 2,500 sqm premium office space that increased
|
||||
employee productivity by 40% and achieved LEED
|
||||
certification.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project Gallery -->
|
||||
<div class="project-gallery">
|
||||
<h3>Project Gallery</h3>
|
||||
<div class="gallery-grid">
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-1.jpg"
|
||||
alt="Corporate Tower Interior"
|
||||
/>
|
||||
</div>
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-2.jpg"
|
||||
alt="Modern Workspace"
|
||||
/>
|
||||
</div>
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-3.jpg"
|
||||
alt="Meeting Rooms"
|
||||
/>
|
||||
</div>
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-4.jpg"
|
||||
alt="Reception Area"
|
||||
/>
|
||||
</div>
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-5.jpg"
|
||||
alt="Collaborative Spaces"
|
||||
/>
|
||||
</div>
|
||||
<div class="gallery-item">
|
||||
<img
|
||||
src="images/projects/accra-corporate-tower-6.jpg"
|
||||
alt="Building Exterior"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Related Projects -->
|
||||
<section class="related-projects">
|
||||
<div class="container">
|
||||
<h2>Related Projects</h2>
|
||||
<div class="related-projects-grid">
|
||||
<div class="project-card">
|
||||
<div
|
||||
class="project-card-image"
|
||||
style="
|
||||
background-image: url('images/projects/takoradi-office-cover.jpg');
|
||||
"
|
||||
>
|
||||
<div class="project-card-overlay"></div>
|
||||
</div>
|
||||
<div class="project-card-content">
|
||||
<div class="project-card-category">Corporate</div>
|
||||
<h3 class="project-card-title">Takoradi Office Complex</h3>
|
||||
<p class="project-card-location">Takoradi, Ghana</p>
|
||||
<a
|
||||
href="project-takoradi-office-complex.html"
|
||||
class="project-card-link"
|
||||
>View Project</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="project-card">
|
||||
<div
|
||||
class="project-card-image"
|
||||
style="
|
||||
background-image: url('images/projects/kumasi-library-cover.jpg');
|
||||
"
|
||||
>
|
||||
<div class="project-card-overlay"></div>
|
||||
</div>
|
||||
<div class="project-card-content">
|
||||
<div class="project-card-category">Education</div>
|
||||
<h3 class="project-card-title">Kumasi University Library</h3>
|
||||
<p class="project-card-location">Kumasi, Ghana</p>
|
||||
<a
|
||||
href="project-kumasi-university-library.html"
|
||||
class="project-card-link"
|
||||
>View Project</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="project-card">
|
||||
<div
|
||||
class="project-card-image"
|
||||
style="
|
||||
background-image: url('images/projects/tema-hotel-cover.jpg');
|
||||
"
|
||||
>
|
||||
<div class="project-card-overlay"></div>
|
||||
</div>
|
||||
<div class="project-card-content">
|
||||
<div class="project-card-category">Hospitality</div>
|
||||
<h3 class="project-card-title">Tema Harbor Hotel</h3>
|
||||
<p class="project-card-location">Tema, Ghana</p>
|
||||
<a
|
||||
href="project-tema-harbor-hotel.html"
|
||||
class="project-card-link"
|
||||
>View Project</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="footer-content">
|
||||
<div class="footer-logo">
|
||||
<img src="images/kh3_logo.png" alt="KH3" class="logo-image" />
|
||||
<span class="logo-text">KH3</span>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<a href="contact.html">Contact</a>
|
||||
<a href="about.html">About</a>
|
||||
<a href="projects.html">Projects</a>
|
||||
<a href="services.html">Services</a>
|
||||
<a href="careers.html">Careers</a>
|
||||
<a href="privacy.html">Privacy Policy</a>
|
||||
<a href="terms.html">Terms of Service</a>
|
||||
</div>
|
||||
<div class="footer-copyright">© 2024 KH3. All rights reserved.</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Add table
Add a link
Reference in a new issue