196 lines
No EOL
10 KiB
HTML
196 lines
No EOL
10 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>KHY Business Limited - Furniture & Joinery Solutions</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
|
|
<header>
|
|
<div class="container">
|
|
<a href="#home" class="logo">
|
|
<img src="images/logo-khy.png" alt="KHY Limited Logo">
|
|
</a>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="#about">About</a></li>
|
|
<li><a href="#products">Products</a></li>
|
|
<li><a href="#projects">Projects</a></li>
|
|
<li><a href="#partners">Partners</a></li>
|
|
<li><a href="#clients">Clients</a></li>
|
|
<li><a href="#contact">Contact</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<!-- Hero Section -->
|
|
<section id="home" class="hero">
|
|
<div class="hero-content">
|
|
<h1>Redefining the Artistry of Furniture</h1>
|
|
<p>Creating beautiful and functional spaces that inspire and enhance everyday living.</p>
|
|
<a href="#about" class="cta-button">Learn More</a>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- About Section -->
|
|
<section id="about" class="content-section">
|
|
<div class="container">
|
|
<h2>Introduction to KHY</h2>
|
|
<p class="intro-text">KHY Business Limited specializes in the supply and installation of furniture and joinery solutions. Our multi-skilled team is dedicated to understanding your projects in an integral way such that your needs are met. This is fueled by the drive to be the Standard of Global Excellence in Africa.</p>
|
|
|
|
<div class="about-grid">
|
|
<div class="about-card">
|
|
<h3>Our Vision</h3>
|
|
<p>To create beautiful, functional spaces that inspire and enrich everyday living.</p>
|
|
</div>
|
|
<div class="about-card">
|
|
<h3>Our Mission</h3>
|
|
<p>To provide innovative furniture solutions that transform ordinary spaces into extraordinary environments.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<h3>Our Values</h3>
|
|
<div class="values-grid">
|
|
<div class="value-item"><strong>Respect:</strong> We treat each other and everyone with dignity. We strive to make sure every individual feels valued and heard.</div>
|
|
<div class="value-item"><strong>Integrity:</strong> In all our dealings we strive to be transparent and ethically responsible by staying true to our commitments and doing the right thing even when no one is watching.</div>
|
|
<div class="value-item"><strong>Simplicity:</strong> We value clarity and efficiency, creating solutions that are easy to understand and use.</div>
|
|
<div class="value-item"><strong>Excellence:</strong> We are committed to consistently delivering exceptional results.</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Products Section -->
|
|
<section id="products" class="content-section-dark">
|
|
<div class="container">
|
|
<h2>Our Products</h2>
|
|
<p class="intro-text">We use a wide range of office furniture products to create space optimization solutions that provide value for money without sacrificing quality, aesthetics, and customer satisfaction.</p>
|
|
<div class="product-grid">
|
|
<!-- Recommended image size: 400x300px -->
|
|
<div class="product-card">
|
|
<img src="images/product-chairs.jpg" alt="Office Chairs">
|
|
<h4>Chairs</h4>
|
|
</div>
|
|
<div class="product-card">
|
|
<img src="images/product-tables.jpg" alt="Office Tables">
|
|
<h4>Tables</h4>
|
|
</div>
|
|
<div class="product-card">
|
|
<img src="images/product-collaboration.jpg" alt="Collaboration Solutions">
|
|
<h4>Collaboration Solutions</h4>
|
|
</div>
|
|
<div class="product-card">
|
|
<img src="images/product-storage.jpg" alt="Storage Units">
|
|
<h4>Storage</h4>
|
|
</div>
|
|
<div class="product-card">
|
|
<img src="images/product-seating.jpg" alt="Soft Seating">
|
|
<h4>Soft Seating</h4>
|
|
</div>
|
|
<div class="product-card">
|
|
<img src="images/product-accessories.jpg" alt="Office Accessories">
|
|
<h4>Accessories</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Projects Section -->
|
|
<section id="projects" class="content-section">
|
|
<div class="container">
|
|
<h2>Past Projects</h2>
|
|
<p class="intro-text">Explore a selection of our completed projects where we have transformed ordinary spaces into extraordinary environments, blending quality craftsmanship with thoughtful design.</p>
|
|
<div class="css-slider-container">
|
|
<!-- These radio buttons control the slides. They will be hidden with CSS. -->
|
|
<input type="radio" name="slider" id="slide-1" checked>
|
|
<input type="radio" name="slider" id="slide-2">
|
|
<input type="radio" name="slider" id="slide-3">
|
|
<input type="radio" name="slider" id="slide-4">
|
|
<input type="radio" name="slider" id="slide-5">
|
|
|
|
<!-- The slider itself: a viewport and a wrapper for the images -->
|
|
<div class="slider-viewport">
|
|
<div class="slider-wrapper">
|
|
<div class="slide"><img src="images/project-1.jpg" alt="Project 1"></div>
|
|
<div class="slide"><img src="images/project-2.jpg" alt="Project 2"></div>
|
|
<div class="slide"><img src="images/project-3.jpg" alt="Project 3"></div>
|
|
<div class="slide"><img src="images/project-4.jpg" alt="Project 4"></div>
|
|
<div class="slide"><img src="images/project-5.jpg" alt="Project 5"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- The navigation dots are labels for the hidden radio buttons -->
|
|
<div class="slider-nav">
|
|
<label for="slide-1"></label>
|
|
<label for="slide-2"></label>
|
|
<label for="slide-3"></label>
|
|
<label for="slide-4"></label>
|
|
<label for="slide-5"></label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Partners Section -->
|
|
<section id="partners" class="content-section-dark">
|
|
<div class="container">
|
|
<h2>Our Partners</h2>
|
|
<div class="logo-grid">
|
|
<!-- Replace with partner logos. Recommended size: 200x100px, transparent background PNG is best -->
|
|
<img src="images/logo-bene.png" alt="Bene Logo">
|
|
<img src="images/logo-cecilnurse.webp" alt="Cecil Nurse Logo">
|
|
<img src="images/logo-andreu.svg" alt="Andreu World Logo">
|
|
<img src="images/logo-rim.png" alt="Rim Logo">
|
|
<img src="images/logo-entrawood.png" alt="Entrawood Logo">
|
|
<img src="images/logo-forma5.svg" alt="Forma 5 Logo">
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Clients Section -->
|
|
<section id="clients" class="content-section">
|
|
<div class="container">
|
|
<h2>Trusted By</h2>
|
|
<div class="logo-grid">
|
|
<!-- Replace with client logos. Recommended size: 200x100px, transparent background PNG is best -->
|
|
<img src="images/logo-norfund.png" alt="Norfund Logo">
|
|
<img src="images/logo-glico.png" alt="Glico Healthcare Logo">
|
|
<img src="images/logo-stanbic.webp" alt="Stanbic Bank Logo">
|
|
<img src="images/logo-grow.png" alt="GROW Engineering Logo">
|
|
<img src="images/logo-dbg.png" alt="Development Bank Ghana Logo">
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Contact Section -->
|
|
<section id="contact" class="content-section-dark">
|
|
<div class="container">
|
|
<h2>Get In Touch</h2>
|
|
<p class="intro-text">We look forward to beautiful design moments through exciting collaborations. Let's create something exceptional together.</p>
|
|
<div class="contact-details">
|
|
<p><strong>Email:</strong> design@khyltd.com</p>
|
|
<p><strong>Address:</strong> 5 Labone Crescent, Accra</p>
|
|
<!--p><strong>Let's Connect:</strong> <a href="#">Facebook</a> | <a href="#">Instagram</a></p -->
|
|
</div>
|
|
<div class="location">
|
|
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d992.7500806834357!2d-0.1740834035402134!3d5.566966635513506!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xfdf9b1cccb8fef9%3A0x87ed0cab0f0b7925!2sLadies%E2%80%99%20Entrepreneurship%20Club!5e0!3m2!1sen!2sgh!4v1750883689253!5m2!1sen!2sgh" width="60%" height="300" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<div class="container">
|
|
<p>© 2025 KHY Business Limited. All Rights Reserved.</p>
|
|
<p>Beyond your imagination beautifully furnished.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html> |