Files
preview_sites/proposals/mobile-galaxy-gaming/mockup/pages/Project/Project-Single.html
T

573 lines
24 KiB
HTML
Executable File

<!DOCTYPE html>
<html lang="en">
<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">
<!-- Title -->
<title>LeafLine | Gardening and Landscaping Website</title>
<!-- Favicon -->
<link rel="icon" type="image/x-icon" href="../../assets/images/favicon.ico">
<!-- Font-Awesome (CSS) -->
<link rel="stylesheet" href="../../assets/vendors/font-awesome/css/all.min.css">
<!-- Magnific-Popup (CSS) -->
<link rel="stylesheet" href="../../assets/vendors/magnific-popup/magnific-popup.css">
<!-- Custom Stylesheets -->
<link rel="stylesheet" href="../../assets/css/main.css">
<link rel="stylesheet" href="../../assets/css/responsive.css">
</head>
<body>
<!-- ==================== Scroll-Top Area (Start) ==================== -->
<a href="#" class="scroll-top">
<i class="fa-solid fa-arrow-up-long"></i>
</a>
<!-- ==================== Scroll-Top Area (End) ==================== -->
<!-- ==================== Header Area (Start) ==================== -->
<header class="header">
<!-- ===== Header-1 Area (Start) ===== -->
<div class="header-1">
<!-- == Contacts == -->
<ul class="header-contacts">
<li><i class="fa-solid fa-location-dot"></i><span>LeafLine Company</span></li>
<li><i class="fa-solid fa-phone"></i><span>+123-456-7890</span></li>
<li><i class="fa-solid fa-envelope"></i><span class="gmail">info@leafline.com</span></li>
</ul>
<!-- == Social == -->
<ul class="social-contacts">
<li><a href="#" class="fab fa-facebook-f"></a></li>
<li><a href="#" class="fa-brands fa-x-twitter"></a></li>
<li><a href="#" class="fab fa-instagram"></a></li>
<li><a href="#" class="fab fa-linkedin"></a></li>
</ul>
</div>
<!-- ===== Header-1 Area (End) ===== -->
<!-- ===== Header-2 Area (Start) ===== -->
<div class="header-2">
<!-- == Logo == -->
<a class="logo" href="../../index.html">
<img src="../../assets/images/Logo/Logo.png" alt="logo">
<div class="logo-content">
<h3>LeafLine</h3>
<p>Gardening & Landscaping</p>
</div>
</a>
<div class="container">
<!-- == Navbar == -->
<nav class="navbar">
<a class="nav-btn" href="../../index.html">home</a>
<div class="dropdown-menu">
<button class="nav-btn">about</button>
<div class="dropdown-content">
<a href="../../pages/About/About.html">about us</a>
<a href="../../pages/About/WhyUs.html">Why Choose Us</a>
<a href="../../pages/About/History.html">History</a>
<a href="../../pages/About/Team.html">Team</a>
<a href="../../pages/About/Team-Single.html">Team Single</a>
<a href="../../pages/About/Testimonials.html">testimonials</a>
<a href="../../pages/About/FAQs.html">FAQs</a>
</div>
</div>
<div class="dropdown-menu">
<button class="nav-btn">Pages</button>
<div class="dropdown-content">
<a href="../../pages/Pages/Gallery.html">Gallery</a>
<a href="../../pages/Pages/Pricing.html">Pricing</a>
<a href="../../pages/Pages/Process.html">work process</a>
<a href="../../pages/Pages/Awards.html">Awards</a>
<div class="side-dropdown">
<button>Event</button> <i class="fa-solid fa-chevron-right"></i>
<div class="dropdown-content">
<a href="../../pages/Pages/Events.html">Events</a>
<a href="../../pages/Pages/Event-Single.html">Event Single</a>
</div>
</div>
<div class="side-dropdown">
<button>Career</button> <i class="fa-solid fa-chevron-right"></i>
<div class="dropdown-content">
<a href="../../pages/Pages/Careers.html">Careers</a>
<a href="../../pages/Pages/Career-Single.html">Career Single</a>
<a href="../../pages/Pages/Career-Form.html">Career Form</a>
</div>
</div>
<div class="side-dropdown">
<button>Information Hub</button> <i class="fa-solid fa-chevron-right"></i>
<div class="dropdown-content">
<a href="../../pages/Pages/Not-Found.html">Not Found</a>
<a href="../../pages/Pages/Privacy-Policy.html">Privacy Policy</a>
<a href="../../pages/Pages/Terms.html">Terms & Condition</a>
</div>
</div>
<a href="../../pages/Pages/Cost-Calculator.html">cost calculator</a>
<a href="../../pages/Pages/Get-Quote.html">get a quote</a>
<a href="../../pages/Pages/Clients.html">clients</a>
</div>
</div>
<div class="dropdown-menu">
<button class="nav-btn">Service</button>
<div class="dropdown-content">
<a href="../../pages/Service/Services.html">Services</a>
<a href="../../pages/Service/Service-Single.html">Service Single</a>
</div>
</div>
<div class="dropdown-menu">
<button class="nav-btn">Project</button>
<div class="dropdown-content">
<a href="../../pages/Project/Projects.html">Projects</a>
<a href="../../pages/Project/Project-Single.html">Project Single</a>
</div>
</div>
<div class="dropdown-menu">
<button class="nav-btn">blog</button>
<div class="dropdown-content">
<a href="../../pages/Blog/Blog-Grid.html">blogs grid</a>
<a href="../../pages/Blog/Blog-List.html">blogs list</a>
<a href="../../pages/Blog/Blog-Single.html">blog Single</a>
</div>
</div>
<div class="dropdown-menu">
<button class="nav-btn">shop</button>
<div class="dropdown-content">
<a href="../../pages/Shop/Shop-Grid.html">shop grid</a>
<a href="../../pages/Shop/Shop-List.html">shop list</a>
<a href="../../pages/Shop/Product-Single.html">product Single</a>
<a href="../../pages/Shop/Wishlist.html">wishlist</a>
<a href="../../pages/Shop/Cart.html">cart</a>
<a href="../../pages/Shop/Checkout.html">checkout</a>
<a href="../../pages/Shop/Login.html">login</a>
<a href="../../pages/Shop/Register.html">register</a>
<a href="../../pages/Shop/Reset-Password.html">forgot Password</a>
</div>
</div>
<a class="nav-btn" href="../../pages/Contact/Contact.html">contact</a>
</nav>
<!-- == Icon Container == -->
<div class="icon-container">
<div id="search-btn" class="icon fa-solid fa-magnifying-glass"></div> <!-- Search Icon -->
<div id="menu-btn" class="icon fa-solid fa-bars-staggered"></div>
<a href="../../pages/Pages/Get-Quote.html" class="btn">get A quote</a>
</div>
<!-- == Search Container == -->
<form class="search-container">
<input type="search" id="search-bar" placeholder="search here" required> <!-- Search Input -->
<button type="submit"><i class="fas fa-search"></i></button> <!-- Submit Button -->
</form>
</div>
</div>
<!-- ===== Header-2 Area (End) ===== -->
<!-- ===== Mobile Menu Area (Start) ===== -->
<div class="mobile-menu">
<nav class="mobile-navbar">
<div class="nav-link">
<div class="main-nav-link"> <a class="nav-btn" href="../../index.html">home</a> </div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">about</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/About/About.html">about us</a>
<a href="../../pages/About/WhyUs.html">Why Choose Us</a>
<a href="../../pages/About/History.html">History</a>
<a href="../../pages/About/Team.html">Team</a>
<a href="../../pages/About/Team-Single.html">Team Single</a>
<a href="../../pages/About/Testimonials.html">testimonials</a>
<a href="../../pages/About/FAQs.html">FAQs</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">pages</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/Pages/Gallery.html">Gallery</a>
<a href="../../pages/Pages/Pricing.html">Pricing</a>
<a href="../../pages/Pages/Process.html">work process</a>
<a href="../../pages/Pages/Awards.html">Awards</a>
<a href="../../pages/Pages/Events.html">Events</a>
<a href="../../pages/Pages/Event-Single.html">Event Single</a>
<a href="../../pages/Pages/Careers.html">Careers</a>
<a href="../../pages/Pages/Career-Single.html">Career Single</a>
<a href="../../pages/Pages/Career-Form.html">Career Form</a>
<a href="../../pages/Pages/Not-Found.html">Not Found</a>
<a href="../../pages/Pages/Privacy-Policy.html">Privacy Policy</a>
<a href="../../pages/Pages/Terms.html">Terms & Condition</a>
<a href="../../pages/Pages/Cost-Calculator.html">cost calculator</a>
<a href="../../pages/Pages/Get-Quote.html">get a quote</a>
<a href="../../pages/Pages/Clients.html">clients</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">Service</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/Service/Services.html">Services</a>
<a href="../../pages/Service/Service-Single.html">Service Single</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">Project</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/Project/Projects.html">Projects</a>
<a href="../../pages/Project/Project-Single.html">Project Single</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">blog</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/Blog/Blog-Grid.html">blogs grid</a>
<a href="../../pages/Blog/Blog-List.html">blogs list</a>
<a href="../../pages/Blog/Blog-Single.html">blog Single</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <div class="nav-btn">Shop</div> <i class="fas fa-plus"></i> </div>
<div class="sub-nav-link">
<a href="../../pages/Shop/Shop-Grid.html">shop grid</a>
<a href="../../pages/Shop/Shop-List.html">shop list</a>
<a href="../../pages/Shop/Product-Single.html">product Single</a>
<a href="../../pages/Shop/Wishlist.html">wishlist</a>
<a href="../../pages/Shop/Cart.html">cart</a>
<a href="../../pages/Shop/Checkout.html">checkout</a>
<a href="../../pages/Shop/Login.html">login</a>
<a href="../../pages/Shop/Register.html">register</a>
<a href="../../pages/Shop/Reset-Password.html">forgot Password</a>
</div>
</div>
<div class="nav-link">
<div class="main-nav-link"> <a class="nav-btn" href="../../pages/Contact/Contact.html">contact</a> </div>
</div>
</nav>
</div>
<!-- ===== Mobile Menu Area (End) ===== -->
</header>
<!-- ==================== Header Area (End) ==================== -->
<!-- ==================== Page-Title (Start) ==================== -->
<div class="page-title">
<div class="title">
<h2>Project Single</h2>
</div>
<div class="link">
<a href="../../index.html">Home</a>
<i class="fa-solid fa-angles-right"></i>
<span class="page">Project Single</span>
</div>
</div>
<!-- ==================== Page-Title (End) ==================== -->
<!-- ==================== Project Single (Start) ==================== -->
<section class="project-single page-single">
<!-- Project Info Area (Start) -->
<div class="project-info page-info">
<!-- Project Image -->
<div class="image">
<img src="../../assets/images/Project/Projects/Project-1.jpg" alt="Theme Garden Installation">
</div>
<!-- Project Content -->
<div class="content">
<!-- Main Heading -->
<h2 class="main-heading">Zen Garden Landscaping</h2>
<!-- Project Important Note -->
<p class="important">Experience tranquility and harmony with our professional Zen garden landscaping services. We design serene outdoor spaces inspired by Japanese aesthetics, promoting peace, balance, and mindfulness.</p>
<!-- Project Description -->
<p>Our Zen garden landscaping service focuses on creating minimalist, peaceful environments using natural elements such as rocks, sand, gravel, and carefully placed greenery. Whether for residential or commercial spaces, our designs embody simplicity, calmness, and spiritual reflection—perfect for meditation and relaxation.</p>
<!-- Project Gallery -->
<div class="project-gallery page-gallery">
<a href="../../assets/images/Project/Project-Gallery/1.jpg">
<img src="../../assets/images/Project/Project-Gallery/1.jpg" alt="Theme Garden Installation Gallery Image 1">
</a>
<a href="../../assets/images/Project/Project-Gallery/2.jpg">
<img src="../../assets/images/Project/Project-Gallery/2.jpg" alt="Theme Garden Installation Gallery Image 2">
</a>
<a href="../../assets/images/Project/Project-Gallery/3.jpg">
<img src="../../assets/images/Project/Project-Gallery/3.jpg" alt="Theme Garden Installation Gallery Image 3">
</a>
<a href="../../assets/images/Project/Project-Gallery/4.jpg">
<img src="../../assets/images/Project/Project-Gallery/4.jpg" alt="Theme Garden Installation Gallery Image 4">
</a>
<a href="../../assets/images/Project/Project-Gallery/5.jpg">
<img src="../../assets/images/Project/Project-Gallery/5.jpg" alt="Theme Garden Installation Gallery Image 5">
</a>
<a href="../../assets/images/Project/Project-Gallery/6.jpg">
<img src="../../assets/images/Project/Project-Gallery/6.jpg" alt="Theme Garden Installation Gallery Image 6">
</a>
</div>
<!-- Project Challenges -->
<div class="sub-section">
<h3 class="sub-heading">Project Challenges:</h3>
<p>Our Zen garden landscaping services address:</p>
<ul>
<li><i class="fa-solid fa-check"></i> Achieving Minimalist Yet Balanced Design</li>
<li><i class="fa-solid fa-check"></i> Harmonizing Natural Elements like Rocks, Sand, and Plants</li>
<li><i class="fa-solid fa-check"></i> Creating a Peaceful Flow within Limited Spaces</li>
</ul>
</div>
<!-- Project Solutions -->
<div class="sub-section">
<h3 class="sub-heading">Project Solutions:</h3>
<p>We provide thoughtful and refined solutions including:</p>
<ul>
<li><i class="fa-solid fa-caret-right"></i> Precision Layouts Reflecting Zen Philosophy</li>
<li><i class="fa-solid fa-caret-right"></i> Use of Natural and Sustainable Materials</li>
<li><i class="fa-solid fa-caret-right"></i> Expert Placement for Visual and Spiritual Harmony</li>
</ul>
</div>
<!-- Project Result -->
<div class="sub-section">
<h3 class="sub-heading">Project Result:</h3>
<p>Our Zen garden designs deliver:</p>
<ul>
<li><i class="fa-solid fa-circle-notch"></i> A Serene and Meditative Outdoor Environment</li>
<li><i class="fa-solid fa-circle-notch"></i> Balanced Composition that Promotes Relaxation</li>
<li><i class="fa-solid fa-circle-notch"></i> Timeless Aesthetic with Low Maintenance Needs</li>
</ul>
</div>
</div>
</div>
<!-- Project Info Area (End) -->
<!-- Project Details Area (Start) -->
<div class="project-sidebar page-sidebar">
<h3 class="sub-heading">Project Info</h3>
<div class="container">
<!-- Date -->
<div class="detail-item">
<i class="fa-regular fa-calendar-days"></i>
<div class="detail-content">
<h3>Date</h3>
<p>September 15, 2025</p>
</div>
</div>
<!-- Client -->
<div class="detail-item">
<i class="fa-solid fa-user"></i>
<div class="detail-content">
<h3>Client</h3>
<p>Landscaping specialist</p>
</div>
</div>
<!-- Category -->
<div class="detail-item">
<i class="fa-solid fa-list-ul"></i>
<div class="detail-content">
<h3>Category</h3>
<p>Garden design</p>
</div>
</div>
<!-- Location -->
<div class="detail-item">
<i class="fa-regular fa-map"></i>
<div class="detail-content">
<h3>Service Area</h3>
<p>Park Installation</p>
</div>
</div>
<!-- Duration -->
<div class="detail-item">
<i class="fa-regular fa-clock"></i>
<div class="detail-content">
<h3>Duration</h3>
<p>12 days</p>
</div>
</div>
<!-- Cost -->
<div class="detail-item">
<i class="fa-solid fa-dollar-sign"></i>
<div class="detail-content">
<h3>Cost</h3>
<p>$2000</p>
</div>
</div>
<!-- Lead Designer -->
<div class="detail-item">
<i class="fa-solid fa-user-gear"></i>
<div class="detail-content">
<h3>Lead Designer</h3>
<p>Jeremy Scalls</p>
</div>
</div>
</div>
</div>
<!-- Project Details Area (End) -->
</section>
<!-- ==================== Project Single (End) ==================== -->
<!-- ==================== Footer Area (Start) ==================== -->
<footer class="footer">
<div class="box-container">
<!-- Gardening and Landscaping Company Information & Social Media Links -->
<div class="footer-item">
<!-- Gardening and Landscaping Company Logo -->
<a class="logo" href="../../index.html">
<img src="../../assets/images/Logo/Logo.png" alt="logo">
<div class="logo-content">
<h3>LeafLine</h3>
<p>Gardening & Landscaping</p>
</div>
</a>
<!-- Description -->
<p>Transforming outdoor spaces with premium gardening and landscaping solutions.</p>
<!-- Contact Information -->
<div class="info connect">
<p><i class="fas fa-phone"></i><span>+123-456-7890</span></p>
<p><i class="fas fa-envelope"></i><span class="gmail">info@leafline.com</span></p>
<p><i class="fas fa-map-marker-alt"></i><span>LeafLine Company</span></p>
</div>
<!-- Social Media Links -->
<div class="social">
<a href="#"><i class="fab fa-facebook-f"></i></a>
<a href="#"><i class="fa-brands fa-x-twitter"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-linkedin"></i></a>
</div>
</div>
<!-- Gardening and Landscaping Services Offered -->
<div class="footer-item">
<h2>Our Services</h2>
<div class="info links">
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">Lawn Care</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">Garden Design</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">Tree Planting</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">Hardscaping Solution</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">water ponds</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Service-Single.html">Outdoor Décor</a></p>
</div>
</div>
<!-- Quick Links -->
<div class="footer-item">
<h2>Quick Links</h2>
<div class="info links">
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/About/About.html">About Us</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Service/Services.html">Services</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Project/Projects.html">Projects</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Blog/Blog-Grid.html">Blog</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Shop/Shop-Grid.html">Shop</a></p>
<p><i class="fa-brands fa-pagelines"></i><a href="../../pages/Contact/Contact.html">Contact Us</a></p>
</div>
</div>
<!-- Newsletter Subscription -->
<div class="footer-item">
<h2>Newsletter</h2>
<p>Stay informed and up-to-date with the latest trends, helpful tips, and exclusive special offers.</p>
<form class="dark-form" method="post" id="newsletter-form-2">
<div class="input-field">
<label for="news-email-2" class="fas fa-envelope"></label>
<input type="email" id="news-email-2" name="email" class="box" placeholder="Your email address" required>
</div>
<button type="submit" class="btn" name="submit" id="submit-2">Subscribe</button>
<span class="alert" id="msg-2"></span>
</form>
</div>
</div>
<!-- Gardening and Landscaping Company's Name and Copyright -->
<div class="content">
<p>Designed By <span>NorthStar_Themes</span> | All Rights Reserved</p>
</div>
</footer>
<!-- ==================== Footer Area (End) ==================== -->
<!-- Jquery -->
<script src="../../assets/vendors/jquery/jquery.min.js"></script>
<!-- Magnific-Popup JS -->
<script src="../../assets/vendors/magnific-popup/jquery.magnific-popup.min.js"></script>
<!-- Custom Script Files -->
<script src="../../assets/js/script.js"></script> <!-- Custom JavaScript file with additional website functionality. -->
<script src="../../assets/js/nav-link-toggler.js"></script> <!-- Manages navigation link toggling (e.g., hamburger menu) for mobile devices -->
<script src="../../assets/js/newsletter.js"></script>
<script src="../../assets/js/page-gallery.js"></script> <!-- Manages the gallery functionality of lightbox view. -->
</body>
</html>