Scribd
Upload
7 views

JAVA_PROJECT

The document outlines a Java project for a jewelry website named Zever, featuring multiple JSP pages including Home.jsp, About.jsp, and Services.jsp. Each page contains HTML and CSS code to create a visually appealing layout, showcasing jewelry collections, company philosophy, and a contact form. The website emphasizes user engagement through a clean design and structured navigation, aimed at enhancing the customer experience while promoting the brand's values of craftsmanship and sustainability.

Uploaded by

mittalishaan09
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
7 views

JAVA_PROJECT

The document outlines a Java project for a jewelry website named Zever, featuring multiple JSP pages including Home.jsp, About.jsp, and Services.jsp. Each page contains HTML and CSS code to create a visually appealing layout, showcasing jewelry collections, company philosophy, and a contact form. The website emphasizes user engagement through a clean design and structured navigation, aimed at enhancing the customer experience while promoting the brand's values of craftsmanship and sustainability.

Uploaded by

mittalishaan09
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 17

Name – Khushi Goyal Name – Ishaan Mittal

PRN- 22030121110 PRN - 22030121094


DIV – ‘B’ DIV – ‘B’

JAVA PROJECT

JEWELLERY WEBSITE - ZEVER


Home.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Zever Jewelry - Home</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
color: #333;
}
header {
background-color: #333;
color: white;
padding: 10px 0;
}
.logo img {
max-width: 150px;
margin-left: 20px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
margin-right: 20px;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
}
nav ul li a:hover {
text-decoration: underline;
}

/* Hero Section with Background Image */


.hero {
background-image: url('img/HERO.PNG.jpg'); /* Replace with your
hero image */
background-size: cover;
background-position: center;
height: 70vh;
display: flex;
justify-content: center;
align-items: center;
color: white;
text-align: center;
}
.hero-content {
background: rgba(0, 0, 0, 0.5); /* Optional: Add a dark overlay
*/
padding: 20px;
border-radius: 10px;
}
.hero h1 {
font-size: 48px;
margin-bottom: 20px;
}
.hero p {
font-size: 24px;
margin-bottom: 30px;
}
.cta-button {
padding: 10px 20px;
background-color: #d4a373;
color: white;
text-decoration: none;
font-size: 18px;
border-radius: 5px;
}
.cta-button:hover {
background-color: #b08968;
}

.categories {
padding: 50px 0;
text-align: center;
}
.categories h2 {
font-size: 36px;
margin-bottom: 30px;
}
.category-section {
margin-bottom: 50px;
}
.category-section h3 {
font-size: 28px;
margin-bottom: 20px;
}
.category-grid {
display: flex;
justify-content: space-between;
margin: 0 10px;
}
.category-item {
width: 30%; /* Set width to 30% for three items per row */
display: flex;
justify-content: center;
}
.category-item img {
width: 80%; /* Reduce the image size to 80% of its container */
max-width: 150px; /* Set a maximum width for larger displays */
border-radius: 10px;
}
footer {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
.social-icons {
margin-top: 10px;
}
.social-icons a {
color: white;
margin: 0 10px;
text-decoration: none;
font-size: 24px;
}
.social-icons a:hover {
color: #d4a373;
}

/* Reach Us Section */
.reach-us {
padding: 50px 20px;
background-color: #fff;
text-align: center;
margin: 20px 0;
border-radius: 10px;
}
.reach-us h2 {
margin-bottom: 20px;
}
.reach-us form {
display: flex;
flex-direction: column;
align-items: center;
}
.reach-us input, .reach-us textarea {
width: 80%;
max-width: 400px;
margin: 10px 0;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
}
.reach-us button {
padding: 10px 20px;
background-color: #d4a373;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
.reach-us button:hover {
background-color: #b08968;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="${pageContext.request.contextPath}/img/logo.png.jpg"
alt="Zever Jewellery Logo">
</div>
<nav>
<ul>
<li><a href="home.jsp">Home</a></li>
<li><a href="about.jsp">About Us</a></li>
<li><a href="services.jsp">Services</a></li>
<li><a href="contact.jsp">Contact</a></li>
<li><a href="reviews.jsp">Reviews</a></li>
</ul>
</nav>
</header>

<!-- Hero Section with Background Image -->


<section class="hero">
<div class="hero-content">
<h1>Discover Timeless Jewellery</h1>
<p>Elevate your style with our exclusive collections.</p>
<a href="#reach-us" class="cta-button">Let's Connect</a>
</div>
</section>

<!-- Categories Section -->


<section class="categories">
<h2>Our Collections</h2>

<!-- Rings Section -->


<div class="category-section">
<h3>Rings</h3>
<div class="category-grid">
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/R1.PNG.jpg" alt="Ring 1">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/R2.PNG.jpg" alt="Ring 2">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/R3.PNG.jpg" alt="Ring 3">
</div>
</div>
</div>

<!-- Necklaces Section -->


<div class="category-section">
<h3>Necklaces</h3>
<div class="category-grid">
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/N1.PNG.jpg" alt="Necklace 1">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/N2.PNG.jpg" alt="Necklace 2">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/N3.PNG.jpg" alt="Necklace 3">
</div>
</div>
</div>

<!-- Bracelets Section -->


<div class="category-section">
<h3>Bracelets</h3>
<div class="category-grid">
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/B1.PNG.jpg" alt="Bracelet 1">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/B2.PNG.jpg" alt="Bracelet 2">
</div>
<div class="category-item">
<img
src="${pageContext.request.contextPath}/img/B3.PNG.jpg" alt="Bracelet 3">
</div>
</div>
</div>
</section>

<!-- Reach Us Section -->


<section class="reach-us" id="reach-us">
<h2>Let's Connect</h2>
<p>We would love to hear from you! Please fill out the form below,
and we'll get in touch as soon as possible.</p>
<form action="submit_form.jsp" method="post">
<input type="text" name="name" placeholder="Your Name"
required>
<input type="email" name="email" placeholder="Your Email"
required>
<input type="tel" name="phone" placeholder="Your Phone Number"
required>
<textarea name="message" placeholder="Your Message" rows="5"
required></textarea>
<button type="submit">Submit</button>
</form>
</section>

<footer>
<p>&copy; 2024 Zever Jewellery. All rights reserved.</p>
<div class="social-icons">
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
</div>
</footer>
</body>
</html>

About.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About Us - Zever Jewellery</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
color: #333;
line-height: 1.6;
background-image: url('img/BG.PNG.jpg'); /* Add your background
image path */
background-size: cover; /* Makes the image cover the whole
background */
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Prevent the image from
repeating */
}
header {
background-color: rgba(51, 51, 51, 0.8); /* Slightly
transparent background */
color: white;
padding: 10px 0;
}
.logo img {
max-width: 150px;
margin-left: 20px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
margin-right: 20px;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
}
nav ul li a:hover {
text-decoration: underline;
}
.about-section {
padding: 50px 20px;
text-align: center;
background-color: rgba(255, 255, 255, 0.9); /* White background
with transparency */
border-radius: 10px;
margin: 20px;
}
.about-section h1 {
font-size: 36px;
margin-bottom: 20px;
}
.about-section p {
font-size: 18px;
margin-bottom: 30px;
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.about-section h2 {
font-size: 28px;
margin: 20px 0;
}
.cta-button {
padding: 10px 20px;
background-color: #d4a373;
color: white;
text-decoration: none;
font-size: 18px;
border-radius: 5px;
}
.cta-button:hover {
background-color: #b08968;
}
footer {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
.social-icons {
margin-top: 10px;
}
.social-icons a {
color: white;
margin: 0 10px;
text-decoration: none;
font-size: 24px;
}
.social-icons a:hover {
color: #d4a373;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="${pageContext.request.contextPath}/img/logo.png.jpg"
alt="Zever Jewelry Logo">
</div>
<nav>
<ul>
<li><a href="home.jsp">Home</a></li>
<li><a href="about.jsp">About Us</a></li>
<li><a href="services.jsp">Services</a></li>
<li><a href="contact.jsp">Contact</a></li>
<li><a href="reviews.jsp">Reviews</a></li>
</ul>
</nav>
</header>

<!-- About Section -->


<section class="about-section">
<h1>About Zever Jewellery</h1>
<p>At Zever, we provide timeless, elegant jewellery that celebrates
your individuality. Each piece is crafted with care and attention to
detail, using ethically sourced materials to ensure both luxury and
sustainability.</p>

<h2>Our Philosophy</h2>
<p>We believe that jewellery should tell a story and reflect the
unique personality of the wearer. Our collections are designed to mark
special occasions and add a touch of sophistication to everyday looks,
blending classic beauty with modern design.</p>

<h2>Craftsmanship</h2>
<p>Every piece of jewellery at Zever is crafted by skilled artisans
who take pride in their work. Our commitment to quality ensures that each
item not only looks stunning but is also made to last. We carefully select
materials to uphold our promise of ethical and sustainable practices.</p>

<h2>Join Us</h2>
<p>Explore our collection and find the perfect piece that resonates
with your style. We invite you to experience the elegance and craftsmanship
of Zever Jewellery.</p>
<a href="home.jsp" class="cta-button">Explore Our Collection</a>
</section>

<footer>
<p>&copy; 2024 Zever Jewellery. All rights reserved.</p>
<div class="social-icons">
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
</div>
</footer>
</body>
</html>

Services.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Our Services - Zever Jewelry</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-image: url('img/BG.PNG.jpg'); /* Add your background
image path */
background-size: cover; /* Make the image cover the whole
background */
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Prevent the image from
repeating */
color: #333;
line-height: 1.6;
}
header {
background-color: rgba(51, 51, 51, 0.8); /* Slightly
transparent background */
color: white;
padding: 10px 0;
}
.logo img {
max-width: 150px;
margin-left: 20px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
margin-right: 20px;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
}
nav ul li a:hover {
text-decoration: underline;
}
.services-section {
padding: 50px 20px;
text-align: center;
background-color: rgba(255, 255, 255, 0.9); /* White background
with transparency */
border-radius: 10px;
margin: 20px;
}
.services-section h1 {
font-size: 36px;
margin-bottom: 20px;
}
.service {
margin: 20px 0;
border: 1px solid #ddd;
border-radius: 5px;
padding: 20px;
background-color: #f9f9f9;
}
.service h2 {
font-size: 28px;
margin-bottom: 10px;
}
.service p {
font-size: 18px;
margin: 10px 0;
}
footer {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
.social-icons {
margin-top: 10px;
}
.social-icons a {
color: white;
margin: 0 10px;
text-decoration: none;
font-size: 24px;
}
.social-icons a:hover {
color: #d4a373;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="${pageContext.request.contextPath}/img/logo.png.jpg"
alt="Zever Jewelry Logo">
</div>
<nav>
<ul>
<li><a href="home.jsp">Home</a></li>
<li><a href="about.jsp">About Us</a></li>
<li><a href="services.jsp">Services</a></li>
<li><a href="contact.jsp">Contact</a></li>
<li><a href="reviews.jsp">Reviews</a></li>
</ul>
</nav>
</header>

<!-- Services Section -->


<section class="services-section">
<h1>Our Services</h1>

<div class="service">
<h2>1. Custom Jewellery Design</h2>
<p>Work with our expert designers to create one-of-a-kind,
bespoke pieces tailored to your vision.</p>
</div>

<div class="service">
<h2>2. Jewellery Repair & Restoration</h2>
<p>We provide professional repair services to restore your
cherished pieces to their original beauty, including resizing, polishing,
and stone replacement.</p>
</div>

<div class="service">
<h2>3. Engraving Services</h2>
<p>Personalize your jewellery with custom engravings, making
each piece uniquely yours.</p>
</div>

<div class="service">
<h2>4. Jewellery Cleaning & Polishing</h2>
<p>Keep your jewellery looking its best with our professional
cleaning and polishing services, ensuring it maintains its shine for years
to come.</p>
</div>

<div class="service">
<h2>5. Valuation & Appraisal</h2>
<p>Our certified experts offer valuation and appraisal services
for insurance purposes, ensuring you know the true worth of your precious
items.</p>
</div>

<div class="service">
<h2>6. Jewellery Resizing</h2>
<p>We provide resizing services to ensure that your rings,
bracelets, or necklaces fit perfectly.</p>
</div>

<div class="service">
<h2>7. Gift Wrapping & Packaging</h2>
<p>For that special touch, we offer elegant gift-wrapping
services, perfect for presenting your purchases in style.</p>
</div>
</section>

<footer>
<p>&copy; 2024 Zever Jewellery. All rights reserved.</p>
<div class="social-icons">
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
</div>
</footer>
</body>
</html>

Contact.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Us - Zever Jewelry</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
color: #333;
line-height: 1.6;
}
header {
background-color: #333;
color: white;
padding: 10px 0;
}
.logo img {
max-width: 150px;
margin-left: 20px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
margin-right: 20px;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
}
nav ul li a:hover {
text-decoration: underline;
}
.contact-section {
padding: 50px 20px;
text-align: center;
background-color: #fff;
border-radius: 10px;
margin: 20px;
}
.contact-section h1 {
font-size: 36px;
margin-bottom: 20px;
}
.contact-section p {
font-size: 18px;
margin-bottom: 30px;
}
.contact-form {
max-width: 600px;
margin: 0 auto;
text-align: left;
}
.contact-form input,
.contact-form textarea {
width: 100%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 5px;
}
.contact-form button {
padding: 10px 20px;
background-color: #d4a373;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
.contact-form button:hover {
background-color: #b08968;
}
.map {
margin: 20px 0;
border: 0;
width: 100%;
height: 400px;
}
footer {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
.social-icons {
margin-top: 10px;
}
.social-icons a {
color: white;
margin: 0 10px;
text-decoration: none;
font-size: 24px;
}
.social-icons a:hover {
color: #d4a373;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="logo.png.jpg" alt="Zever Jewelry Logo">
</div>
<nav>
<ul>
<li><a href="home.jsp">Home</a></li>
<li><a href="about.jsp">About Us</a></li>
<li><a href="services.jsp">Services</a></li>
<li><a href="contact.jsp">Contact</a></li>
<li><a href="reviews.jsp">Reviews</a></li>
</ul>
</nav>
</header>

<!-- Contact Section -->


<section class="contact-section">
<h1>Contact Us</h1>
<p>If you have any questions or inquiries, feel free to reach out
to us!</p>

<div class="contact-form">
<form action="submit_form.jsp" method="post">
<input type="text" name="name" placeholder="Your Name"
required>
<input type="email" name="email" placeholder="Your Email"
required>
<input type="tel" name="phone" placeholder="Your Phone
Number" required>
<textarea name="message" placeholder="Your Message"
rows="5" required></textarea>
<button type="submit">Submit</button>
</form>
</div>

<!-- Google Maps Embed -->


<h2>Our Location</h2>
<iframe class="map"

src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1853497.03626878
84!2d77.83289005979813!3d29.91521904071936!2m3!1f0!2f0!3f0!3m2!1i1024!2i768
!4f13.1!3m3!1m2!1s0x3908a8c07db0d237%3A0xcad2fa64e4ae21e9!2sOpposite%20Goel
%20Sweet%20Shop%2C%20Arya%20Nagar%2C%20Jwalapur%2C%20Haridwar%2C%20Uttarakh
and%20124901!5e0!3m2!1sen!2sin!4v1697382948985!5m2!1sen!2sin"
allowfullscreen=""
loading="lazy">
</iframe>
</section>

<footer>
<p>&copy; 2024 Zever Jewellery. All rights reserved.</p>
<div class="social-icons">
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
</div>
</footer>
</body>
</html>

Reviews.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Reviews - Zever Jewellery</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: Arial, sans-serif;
background-color: #f4f4f4;
color: #333;
line-height: 1.6;
}
header {
background-color: #333;
color: white;
padding: 10px 0;
}
.logo img {
max-width: 150px;
margin-left: 20px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
margin-right: 20px;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: white;
text-decoration: none;
font-size: 18px;
}
nav ul li a:hover {
text-decoration: underline;
}
.reviews-section {
padding: 50px 20px;
text-align: center;
background-color: #fff;
border-radius: 10px;
margin: 20px;
}
.reviews-section h1 {
font-size: 36px;
margin-bottom: 20px;
}
.reviews-list {
max-width: 800px;
margin: 0 auto;
text-align: left;
margin-bottom: 30px;
}
.review {
border: 1px solid #ddd;
padding: 15px;
margin: 10px 0;
border-radius: 5px;
background-color: #f9f9f9;
}
.review h3 {
margin-bottom: 10px;
}
.review p {
margin-bottom: 5px;
}
.review span {
font-size: 14px;
color: #666;
}
.review-form {
max-width: 600px;
margin: 0 auto;
text-align: left;
}
.review-form input,
.review-form textarea {
width: 100%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 5px;
}
.review-form button {
padding: 10px 20px;
background-color: #d4a373;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
}
.review-form button:hover {
background-color: #b08968;
}
footer {
background-color: #333;
color: white;
padding: 20px;
text-align: center;
}
.social-icons {
margin-top: 10px;
}
.social-icons a {
color: white;
margin: 0 10px;
text-decoration: none;
font-size: 24px;
}
.social-icons a:hover {
color: #d4a373;
}
</style>
</head>
<body>
<header>
<div class="logo">
<img src="${pageContext.request.contextPath}/img/logo.png.jpg"
alt="Zever Jewelry Logo">
</div>
<nav>
<ul>
<li><a href="home.jsp">Home</a></li>
<li><a href="about.jsp">About Us</a></li>
<li><a href="services.jsp">Services</a></li>
<li><a href="contact.jsp">Contact</a></li>
<li><a href="reviews.jsp">Reviews</a></li>
</ul>
</nav>
</header>

<!-- Reviews Section -->


<section class="reviews-section">
<h1>Customer Reviews</h1>

<div class="reviews-list">
<!-- Sample Review -->
<div class="review">
<h3>KRISHNAM LAHOTI</h3>
<p>"Absolutely love my new ring! The craftsmanship is
stunning, and it fits perfectly!"</p>
<span>Rating: ⭐⭐⭐⭐⭐</span>
</div>

<div class="review">
<h3>DIVYANSH MAHESHWARI</h3>
<p>"Zever Jewelry has amazing customer service. They helped
me find the perfect gift for my wife!"</p>
<span>Rating: ⭐⭐⭐⭐⭐</span>
</div>

<div class="review">
<h3>KHUSHI GOYAL</h3>
<p>"I appreciate the ethical sourcing of materials. It's
great to wear something that feels good inside and out!"</p>
<span>Rating: ⭐⭐⭐⭐⭐</span>
</div>
</div>

<!-- Review Submission Form -->


<h2>Leave a Review</h2>
<div class="review-form">
<form action="submit_review.jsp" method="post">
<input type="text" name="name" placeholder="Your Name"
required>
<input type="email" name="email" placeholder="Your Email"
required>
<textarea name="review" placeholder="Your Review" rows="5"
required></textarea>
<button type="submit">Submit Review</button>
</form>
</div>
</section>

<footer>
<p>&copy; 2024 Zever Jewellery. All rights reserved.</p>
<div class="social-icons">
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
</div>
</footer>
</body>
</html>

You might also like