-
Notifications
You must be signed in to change notification settings - Fork 0
/
About.html
78 lines (64 loc) · 3.29 KB
/
About.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
<!DOCTYPE html>
<html lang="en-GB">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<meta name="Description" content="brief description of Jack Brown's history as a designer. ">
<title id="title">About Me</title>
<link rel="stylesheet" href="globalstylesheet.css">
<link rel="stylesheet" href="aboutme.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Abel&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="pagestructure">
<header>
<!-- Start of the NavBar -->
<nav>
<ul class="navcontainer" aria-label="navigationbar">
<li class="navitem"> <a href="index.html">Home </a></li>
<li class="navitem"> <a href="About.html">About </a></li>
<li class="navitem"> <a href="ContactMe.html">Contact Me</a></li>
<li class="navitem"> <a href="Gallery.html">Gallery</a></li>
</ul>
</nav>
<!--End of the NavBar-->
</header>
<main>
<!--video content and text that appears above the video content-->
<div class="video-container">
<video src="videos/Espresso.mp4" controls loop autoplay muted></video>
<!--text that appears when a mouse hovers over the content-->
<div class="video-text"> <h1>Jack Brown is a London-based photographer, videographer and designer, who
specialises in vivid imagery of food, and food cultures. He has 10 years experience capturing food
from across the globe. Whether it is korean street markets, or classical french restaurants, Jack's
images capture food's sensational flavours. </h1></div>
</div>
<div class="mobilevideotext">
<!--Repeated text but only appears when the screen reduces in size-->
<h1> A little bit about Me</h1>
<p>Jack Brown is a London-based photographer, videographer and designer, who
specialises in vivid imagery of food, and food cultures. He has 10 years experience capturing food
from across the globe. Whether it is korean street markets, or classical french restaurants, Jack's
images capture food's sensational flavours. </p></div>
</div>
</main>
<!-- Footer for all pages-->
<footer>
<div class="footerheading">
<h2>Jack Brown Designs ©</h2>
</div>
<ul class="footersocial">
<li><a href="#"><i class="fa fa-facebook"></i></a></li>
<li><a href="#"><i class="fa fa-twitter"></i></a></li>
<li><a href="#"><i class="fa fa-instagram"></i></a></li>
<li><a href="#"><i class="fa fa-youtube"></i></a></li>
<li><a href="#"><i class="fa fa-linkedin-square"></i></a></li>
</ul>
</footer>
<!-- end of the footer-->
</div>
</body>
</html>