-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
107 lines (99 loc) · 5.34 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
<!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>Best online Food | MyFood.com</title>
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Acme&display=swap" rel="stylesheet">
<link rel="stylesheet" media="screen and (max-width:1170px)" href="phone.css">
</head>
<body>
<nav id="navbar">
<div id="logo">
<img src="logo.png" alt="MyFood.com">
</div>
<ul>
<li class="item"><a href="#home">Home</a></li>
<li class="item"><a href="#services-container">Services</a></li>
<li class="item"><a href="#client-section">Our Clients</a></li>
<li class="item"><a href="#contact">Contact Us</a></li>
</ul>
</nav>
<section id="home">
<h1 class="h-primary">
Welcome to MyFood
</h1>
<p class="centre">Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi ab officiis suscipit porro id, temporibus maxime eum eveniet molestiae et veniam in beatae animi ea sunt recusandae vel ex iusto officia mollitia nesciunt, fugit deserunt dicta.
Accusamus vel rem alias accusantium maxime nobis a, sit saepe cum non! Necessitatibus, tempore!
</p>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Magni velit repellendus, quos sed non repudiandae quam aliquid est in impedit iste beatae obcaecati asperiores doloremque eveniet ipsum harum! Explicabo est temporibus, similique quae repellendus
s. Qui libero, id minus quibusdam deserunt nostrum necessitatibus odit.</p>
<button class="btn">ORDER NOW!!</button>
</section>
<section id="services-container">
<h1 class="h-primary">Our Services</h1>
<div id="services">
<div class="box">
<img src="pz.png" alt="">
<h2 class="h-secondary">Food Catering</h2>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Deleniti quis aliquid odit voluptatibus soluta ducimus iste impedit nostrum perferendis cupiditate temporibus voluptatem, distinctio modi nemo amet laborum esse fugit, eaque deserunt
omnis! Consequuntur adipisci ut temporibus nam harum nobis quae dolores voluptatum eveniet unde possimus totam, maiores sint laudantium nostrum!</p>
</div>
<div class="box">
<img src="ds.png" alt="">
<h2 class="h-secondary">Deserts</h2>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Deleniti quis aliquid odit voluptatibus soluta ducimus iste impedit nostrum perferendis cupiditate temporibus voluptatem, distinctio modi nemo amet laborum esse fugit, eaque deserunt
omnis! Consequuntur adipisci ut temporibus nam harum nobis quae dolores voluptatum eveniet unde possimus totam, maiores sint laudantium nostrum!</p>
</div>
<div class="box">
<img src="or.png" alt="">
<h2 class="h-secondary">Food Ordering</h2>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Deleniti quis aliquid odit voluptatibus soluta ducimus iste impedit nostrum perferendis cupiditate temporibus voluptatem, distinctio modi nemo amet laborum esse fugit, eaque deserunt
omnis! Consequuntur adipisci ut temporibus nam harum nobis quae dolores voluptatum eveniet unde possimus totam, maiores sint laudantium nostrum!</p>
</div>
</div>
</section>
<section id="client-section">
<h1 class="h-primary">Our Clients</h1>
<div id="clients">
<div class="client-item">
<img src="c1.png" alt="Our client">
<img src="c2.png" alt="Our client">
<img src="c3.png" alt="Our client">
<img src="c4.png" alt="Our client">
</div>
</div>
</section>
<section id="contact">
<h1 class="h-primary">Contact Us</h1>
<div id="contact-box">
<form action="">
<div class="form-group">
<label for="name">Name: </label>
<input type="text" name="name" id="name" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="name">Email: </label>
<input type="email" name="name" id="email" placeholder="Enter your Email">
</div>
<div class="form-group">
<label for="name">Phone Number: </label>
<input type="phone" name="name" id="phone" placeholder="Enter your Phone Number">
</div>
<div class="form-group">
<label for="name">Message: </label>
<textarea name="message" id="message" cols="30" rows="10"></textarea>
</div>
</form>
</div>
</section>
<footer>
<div class="centre">
Copyright © www.ChussebaaZ.com All rights reserved!
</div>
</footer>
</body>
</html>