-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
119 lines (98 loc) · 4.58 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
<!DOCTYPE html>
<html lang="en-nz" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="normalize.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<link href="https://fonts.googleapis.com/css?family=Quicksand:500,700" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<title>Dog Sitter</title>
</head>
<body>
<!-- Hero section starts -->
<header class="masthead">
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-6 col-lg-5">
<h1><b>Need a dog sitter?</b></h1>
</div>
<div class="w-100"></div>
<div class="col-sm-12 col-md-6 col-lg-5">
<h5 class="text-left"> Find a trusted sitter in your community to look after your dog when you’re busy or
away.</h5>
</div>
<div class="w-100"></div>
<div class="col-sm-12 col-md-6 col-lg-5">
<button type="button" class="btn btn-orange">Learn more</button>
</div>
</div>
</div>
<div class="btm-div">
<img src="./assets/banner-wave.svg" class="btm-image img-fluid" />
</div>
</header>
<!-- Hero section ends -->
<!-- Service section starts-->
<section class="mt-5 mb-5">
<div class="container">
<div class="row justify-content-center">
<div class="col-12">
<h2 class="text-center"><b>Our services</b></h2>
</div>
<div class="w-100"></div>
<div class="col-sm-8 col-md-8 col-lg-6">
<p class="text-center">Local & trusted pet sitters will treat your fur baby like family. You’ll have
piece of mind with regular communication and premium insurance.</p>
</div>
</div>
</div>
<div class="container">
<div class="row mt-4">
<div class="col-sm-12 col-md-12 col-lg-4">
<div class="card">
<img class="card-img-top" src="./assets/card-image-walking.png" alt="Dog Walking">
<div class="card-body">
<h5 class="card-title">Dog Walking</h5>
<p class="card-text">Got a bit more on this week, and need someone to exercise your dog? Or need
someone to regularly walk your dog as you’re no longer able to do it? Look no futher than our
service.</p>
<a href="#" class="btn btn-learn-more">Learn More ></a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-12 col-lg-4">
<div class="card">
<img class="card-img-top " src="./assets/card-image-boarding.png" alt="Dog Boarding">
<div class="card-body">
<h5 class="card-title">Dog Boarding</h5>
<p class="card-text">Instead of going to the kennels, your dog gets to go to someones else, often
with other pets and people for company. Drop off and pick up options also available.</p>
<a href="#" class="btn btn-learn-more">Learn More ></a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-12 col-lg-4">
<div class="card">
<img class="card-img-top" src="./assets/card-image-sitting.png" alt="Dog Sitting">
<div class="card-body">
<h5 class="card-title">Dog Sitting</h5>
<p class="card-text">Your dog gets the comfort and convenience of staying in their own home, as the
sitter comes to yours! There is the added bonus of your home being looked after.</p>
<a href="#" class="btn btn-learn-more">Learn More ></a>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Service section ends-->
<!-- Bootstrap JS-->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4"
crossorigin="anonymous"></script>
</body>
</html>