-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
69 lines (68 loc) · 3.14 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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Woofles</title>
<meta charset="utf-8"/>
<link rel="stylesheet" href="landing-page-stylesheet.css"/>
</head>
<body>
<div class="header">
<p class="logo">Woofles</p>>
<ul>
<li><a href="#our-team-body">About Us</a></li>
<li><a href="#quote-box">Testimonies</a></li>
<li><a href="#footer">Contact</a></li>
</ul>
</div>
<div class="hero">
<div class="hero-left">
<div class="hero-main-text">Think Different</div>
<div class="hero-main-subtext"><p>At Woofles, we provide cutting-edge services for you and your canine buddy, so that you and your best friend can enjoy what truly matters in life - each other.</p></div>
<button class="hero-sign-up">Sign up</button>
</div>
<div class="hero-right">
<img class="hero-img" src="images/rottweiler-gbaefcad7f_640.jpg" alt="boat">
</div>
</div>
<div id="our-team-body">
<p class="our-team-header">Meet our Team</p>
<div class="our-team-container">
<div class="our-team">
<img class="info-pic" src="images/weimaraner-g0d279829e_640.jpg">
<p class="subtext">Chief Exe-cute-ive Wooficer</p>
</div>
<div class="our-team">
<img class="info-pic" src="images/dog-ga78bd2252_640.jpg">
<p class="subtext">Chief O-paw-rating Wooficer</p>
</div>
<div class="our-team">
<img class="info-pic" src="images/english-bulldog-ge2620837c_640.jpg">
<p class="subtext">Chief Fun-ancial Wooficer</p>
</div>
<div class="our-team">
<img class="info-pic" src="images/cocker-spaniel-ge2ac86005_640.jpg">
<p class="subtext">Chief Treat-nology Wooficer</p>
</div>
</div>
</div>
<div id="quote-box">
<p class="quote">“Now this is the Law of the Jungle -- as old and as true as the sky;
And the Wolf that shall keep it may prosper, but the Wolf that shall break it must die.
As the creeper that girdles the tree-trunk the Law runneth forward and back --
For the strength of the Pack is the Wolf, and the strength of the Wolf is the Pack.”</p>
<p class="quoter">- Rudyard Kipling</p>
</div>
<div class="cta-box">
<div class="cta-container">
<div class="cta-textbox">
<p class="cta-header">Howl to action! It's time!</p>
<p class="cta-subtext">Sign up for our product by clicking that button right over there!</p>
</div>
<button class="cta-button">Sign up</button>
</div>
</div>
<div id="footer">
<p>Copyright © <a href="https://www.theodinproject.com">The Odin Project</a> 2021</p>
</div>
</body>
</html>