-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
194 lines (176 loc) · 8.18 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="icon" href="images/logo.png" />
<title>PERFECT CUT</title>
<link rel="stylesheet" href="Barbers.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css" rel="stylesheet">
</head>
<body>
<!-- header start-->
<header class="header">
<!-- nav start -->
<nav class="nav">
<img src="images/logo.png" alt="Perfect Cut Logo" class="logo-img">
<h1 class="logo-text">PERFECT CUT</h1>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#experience">Experience</a></li>
<li><a href="#about">About</a></li>
<li><a href="#services">Services</a></li>
</ul>
</nav>
<!-- nav end -->
</header>
<!-- header end -->
<!-- section one start -->
<div class="spacer" id="home"></div>
<section class="content_container" >
<section class="header_content">
<h1 class="header_heading">PERFECT <br>
CUT
</h1>
<p class="header_sub-heading">
Welcome to Perfect Cut, where we provide the finest haircuts and grooming services for men. With lot of experience, our skilled barbers are here to give you a sharp, fresh look every time you visit.
</p>
<div class="btn-container">
<a href="" class="main-btn">Learn More</a>
</div>
</section>
<section class="header_img-container">
<img src="images/header1.jpg" class="header_img img1">
<img src="images/header2.jpg" class="header_img img2">
</section>
</section>
<!-- section one end -->
<!-- experience section start -->
<div class="spacer" id="experience"></div>
<section class="experience">
<section class="header_content experience_content">
<h2 class="grey_heading">30 years</h2>
<h1 class="header_heading experience-heading">EXPERIENCE</h1>
<p class="header_sub-heading experience_sub-heading">For over three decades, Perfect Cut has been a trusted name in grooming. Our expert barbers combine traditional techniques with modern styles to ensure you leave looking your absolute best.
</p>
<section class="btn-container">
<a href="" class="main-btn">Learn More</a>
</section>
</section>
<div class="experience-img">
</div>
</section>
<!-- experience section end -->
<!-- social media section start -->
<!-- <section class="social-media">
<ul class="social-media-container">
<div class="follow">FOLLOW</div>
<li class="list-items"><a href="">LinkedIn</a></li>
<li class="list-items"><a href="">Instagram</a></li>
<li class="list-items"><a href="">GitHub</a></li> -->
<!-- <li class="list-items"><a href=""></a></li> -->
<!-- </ul>
</section> -->
<!-- social media section end -->
<!-- Customer section start -->
<div class="spacer" id="about"></div>
<section class="customer" >
<div class="customer-container">
<div class="customer-img-container">
</div>
<div class="customer_content">
<h1 class="header_heading customer_heading">Meet Our Heros</h1>
<p class="header_sub-heading customer_sub-heading"> At Perfect Cut, our clients are our heroes. Whether you’re here for a fresh cut or a complete grooming experience, we treat every customer with the care and respect they deserve. Join our community of satisfied clients who trust us for their grooming needs.</p>
<div class="btn-container">
<a href="" class="main-btn">Learn More</a>
</div>
</div>
</div>
</section>
<!-- Customer section end -->
<!-- services section start -->
<div class="spacer" id="services"></div>
<section class="services">
<h2 class="grey_heading services_grey-heading">Top Quality</h2>
<h1 class="header_heading services_heading">SERVICES</h1>
<section class="cards">
<div class="card c1">
<div class="card-img img1"></div>
<div class="card-content">
<h1 class="card-title">Hair Cutting</h1>
<p class="card-info">Experience a precision haircut that’s tailored to your style. Our barbers are trained in the latest techniques to ensure you get the best cut possible.</p>
<a href="" class="main-btn card-btn">Learn More</a>
</div>
</div>
<div class="card c2">
<div class="card-img img2"></div>
<div class="card-content">
<h1 class="card-title">Beard Trimming</h1>
<p class="card-info">A well-groomed beard makes a statement. Our beard trimming services will shape and define your facial hair to perfection.</p>
<a href="" class="main-btn card-btn">Learn More</a>
</div>
</div>
<div class="card c3">
<div class="card-img img3"></div>
<div class="card-content">
<h1 class="card-title">Smooth Shave</h1>
<p class="card-info">Enjoy a smooth, clean shave with our signature straight razor service. Our skilled barbers provide a luxurious shave that will leave your skin feeling fresh and rejuvenated.</p>
<a href="" class="main-btn card-btn">Learn More</a>
</div>
</div>
</div>
</div>
</section>
</section>
<!-- services section end -->
<!-- footer section start -->
<footer class="footer">
<div class="footer_card">
<h1 class="footer_card-title">Branches</h1>
<div class="footer_card-info branches">
<ul>
<li><strong>Wimconagar:</strong> 4th Main Street, opposite to metro</li>
<li><strong>Ramapuram:</strong> 3rd Pine Avenue, near SRM</li>
</ul>
</div>
</div>
<div class="footer_card">
<h1 class="footer_card-title">Timings</h1>
<div class="footer_card-info timings">
<ul>
<li><strong>Weekdays</strong>: 9:00 AM - 7:00 PM</li>
<li><strong>Saturday</strong>: 9:00 AM - 1:00 PM</li>
<li><strong>Sunday</strong>: 10:00 AM - 3:00 PM</li>
</ul>
</div>
</div>
<div class="footer_card">
<h1 class="footer_card-title">Legals</h1>
<div class="footer_card-info"><a href="">Privacy Policy</a></div>
<div class="footer_card-info"><a href="">Terms and Conditions</a></div>
</div>
<div class="footer_card">
<h1 class="footer_card-title">Contact Us</h1>
<div class="footer_card-info"><strong>Phone:</strong>+91 1234567890</div>
<div class="footer_card-info"><strong>Email:</strong> [email protected]</div>
<div class="footer_card-info"><strong>Socials:</strong></div>
<div class="footer_card-info social">
<a href="https://www.linkedin.com/in/siddharth-a-/" target="_blank" rel="noopener noreferrer">
<i class="fa-brands fa-linkedin"></i>
</a>
<a href="https://www.instagram.com" target="_blank" rel="noopener noreferrer">
<i class="fab fa-instagram"></i>
</a>
<a href="https://github.com/Siddhart2004" target="_blank" rel="noopener noreferrer">
<i class="fab fa-github"></i>
</a>
</div>
</div>
</footer>
<!-- Copyright section -->
<div class="footer-copyright">
<p>© 2024 Perfect Cut. All rights reserved.</p>
</div>
<!-- footer section end -->
</body>
</html>