-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
146 lines (142 loc) · 5.5 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
<!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="image/png" href="Images/KBC_chicken.png" />
<link rel="stylesheet" href="CSS/style.css" />
<title>BFC | KBC Fried Chicken</title>
</head>
<body>
<!--NavBar Start-->
<div class="nav-btn">
<label for="nav-check">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 -960 960 960"
width="24px"
fill="#000000"
>
<path
d="M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z"
/>
</svg>
</label>
</div>
<input type="checkbox" id="nav-check" />
<nav class="navbar">
<div class="navbar-header">
<h3>BFC | KBC Fried Chicken</h3>
<img src="Images/image.png" alt="KBC" />
<span class="nav-close">
<label for="nav-check">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 -960 960 960"
width="24px"
fill="#000000"
>
<path
d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"
/>
</svg>
</label>
</span>
</div>
<ul class="nav-items">
<li><a href="#" class="nav-link">Home</a></li>
<li><a href="#" class="nav-link">Features</a></li>
<li><a href="#" class="nav-link">About</a></li>
<li><a href="#" class="nav-link">Product</a></li>
<li><a href="#" class="nav-link">Contact</a></li>
</ul>
</nav>
<!--NavBar End-->
<!--Header start-->
<header class="header">
<div class="banner">
<h2>Discover The Secret To Taste</h2>
<h1>Tender Fried Chicken</h1>
<a href="#" class="btn banner-btn">View More</a>
</div>
</header>
<!--Header end-->
<!--Features start-->
<section class="features">
<div class="features">
<span class="feature-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 -960 960 960"
width="24px"
fill="#000000"
>
<path
d="M640-440 474-602q-31-30-52.5-66.5T400-748q0-55 38.5-93.5T532-880q32 0 60 13.5t48 36.5q20-23 48-36.5t60-13.5q55 0 93.5 38.5T880-748q0 43-21 79.5T807-602L640-440Zm0-112 109-107q19-19 35-40.5t16-48.5q0-22-15-37t-37-15q-14 0-26.5 5.5T700-778l-60 72-60-72q-9-11-21.5-16.5T532-800q-22 0-37 15t-15 37q0 27 16 48.5t35 40.5l109 107ZM280-220l278 76 238-74q-5-9-14.5-15.5T760-240H558q-27 0-43-2t-33-8l-93-31 22-78 81 27q17 5 40 8t68 4q0-11-6.5-21T578-354l-234-86h-64v220ZM40-80v-440h304q7 0 14 1.5t13 3.5l235 87q33 12 53.5 42t20.5 66h80q50 0 85 33t35 87v40L560-60l-280-78v58H40Zm80-80h80v-280h-80v280Zm520-546Z"
/>
</svg>
</span>
<h4>Made with love</h4>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit hic
fugiat sequi dicta numquam? Quis animi exercitationem quos hic quidem!
</p>
</div>
<div class="features">
<span class="feature-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 -960 960 960"
width="24px"
fill="#000000"
>
<path
d="M280-80v-366q-51-14-85.5-56T160-600v-280h80v280h40v-280h80v280h40v-280h80v280q0 56-34.5 98T360-446v366h-80Zm400 0v-320H560v-280q0-83 58.5-141.5T760-880v800h-80Z"
/>
</svg>
</span>
<h4>Taste</h4>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit hic
fugiat sequi dicta numquam? Quis animi exercitationem quos hic quidem!
</p>
</div>
<div class="features">
<span class="feature-icon">
<svg
xmlns="http://www.w3.org/2000/svg"
height="24px"
viewBox="0 -960 960 960"
width="24px"
fill="#000000"
>
<path
d="M160-120v-80h640v80H160Zm160-160q-66 0-113-47t-47-113v-400h640q33 0 56.5 23.5T880-760v120q0 33-23.5 56.5T800-560h-80v120q0 66-47 113t-113 47H320Zm0-80h240q33 0 56.5-23.5T640-440v-320H240v320q0 33 23.5 56.5T320-360Zm400-280h80v-120h-80v120ZM320-360h-80 400-320Z"
/>
</svg>
</span>
<h4>Energy</h4>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit hic
fugiat sequi dicta numquam? Quis animi exercitationem quos hic quidem!
</p>
</div>
</div>
<div class="features">
<span class="feature-icon">
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#000000"><path d="M400-160h160v-44l50-20q65-26 110.5-72.5T786-400H174q20 57 65 103.5T350-224l50 20v44Zm-80 80v-70q-107-42-173.5-130T80-480h80v-320l720-80v60l-460 52v68h460v60H420v160h460q0 112-66.5 200T640-150v70H320Zm0-620h40v-62l-40 5v57Zm-100 0h40v-50l-40 4v46Zm100 220h40v-160h-40v160Zm-100 0h40v-160h-40v160Zm260 80Z"/></svg>
</span>
<h4>Family-Recipie</h4>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit hic
fugiat sequi dicta numquam? Quis animi exercitationem quos hic quidem!
</p>
</div>
</section>
<!--Features end-->
</body>
</html>