-
Notifications
You must be signed in to change notification settings - Fork 1
/
ourteam.html
199 lines (195 loc) · 11.5 KB
/
ourteam.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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Our team</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link href="css/styles.css" type="text/css" rel="stylesheet" />
<link href="pictures/favicon.png" type="image/png" rel="shortcut icon">
<!-- Favicon -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</head>
<body>
<header>
<!-- Navigation bar + logo -->
<!-- RESPONSIVE AND TOGGLEABLE NAVBAR -->
<nav class="navbar fixed-top navbar-dark navOther navbar-expand-sm bg-company-black">
<!-- bg-company-black css-->
<div class="container-fluid"> <img class="navbar-brand navbar-dark py-0 mt-3 ml-15" id="logo" src="pictures/logo.png" alt="logo" title="Logo">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#myNavbar"><span class="navbar-toggler-icon"></span></button>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="navbar-nav mx-auto">
<li class="nav-item py-0 ml-4"><a class="nav-link text-white" href="index.html">
HOME
</a></li>
<li class="nav-item py-0 ml-4"><a class="nav-link text-white" href="services.html">
SERVICES
</a></li>
<li class="nav-item py-0 ml-4"><a class="nav-link text-white" href="aboutus.html">
ABOUT US
</a></li>
<li class="nav-item py-0 ml-4 active"><a class="nav-link text-white" href="ourteam.html">
OUR TEAM
</a></li>
<li class="nav-item py-0 ml-4"><a class="nav-link text-white" href="technologies.html">
TECHNOLOGIES
</a></li>
</ul>
</div>
</div>
</nav>
</header>
<div id="banner"></div>
<div class="row justify-content-center align-items-center title">
<h1 class="text-white d-none d-block aTitle"> OUR TEAM </h1>
</div>
<div class="pusher d-flex justify-content-center align-items-end">
<a href="#arrow"><img class="" id="arrow" src="pictures/down-arrow.png" alt="down" title="down"></a>
</div>
<!----------------------SERVICES CONTENT------------------------------->
<div class="container-fluid services">
<!---------------------SERVICES BANNER------------------------>
<div class="row py-5 banner bannerOurTeam">
<div class="d-flex col-md-3 col-sm-6 bg-transparent justify-content-center box">
<figure> <img class="cat-img" src="pictures/DavidPosition.png" alt="Website Jedi" title="David Le">
<figcaption class="text-white position-absolute ml-4">WEBSITE JEDI</figcaption>
</figure>
</div>
<div class="d-flex col-md-3 col-sm-6 bg-transparent justify-content-center box">
<figure> <img class="cat-img" src="pictures/Meow2.png" alt="Serious Kitty" title="Meow2">
<figcaption class="text-white position-absolute ml-4">SERIOUS KITTY</figcaption>
</figure>
</div>
<div class="d-flex col-md-3 col-sm-6 bg-transparent justify-content-center box">
<figure> <img class="cat-img" src="pictures/Meow3.png" alt="Graphic Grump" title="Meow3">
<figcaption class="text-white position-absolute ml-2">GRAPHIC GRUMP</figcaption>
</figure>
</div>
<div class="d-flex col-md-3 col-sm-6 bg-transparent justify-content-center box">
<figure> <img class="cat-img" src="pictures/Meow4.png" alt="JAVA Master Yi" title="Meow4">
<figcaption class="text-white position-absolute ml-3">JAVA MASTER YI</figcaption>
</figure>
</div>
</div>
<!-------------SERVICES INFO------------------>
<div id="infobanner" class="p-3">
<div class="row border border-white rounded mb-3 team">
<div class="offset-col-2 col-5">
<h2 class="text-white">David Le</h2><img class="profile-img" src="pictures/David.jpg" alt="David Le" title="David Le">
</div>
<p class="text-white col-md-6">David is 19 years old coming from Czech Republic. He is currently an ICT Engineering student in Horsens, Denmark. The boss of this company.</p>
<ul class="text-white col-md-6">
<li>
<h3>E-mail:</h3> <a href="mailto:ledaodavid@gmail.com">ledaodavid@gmail.com</a>
</li>
<li>
<h3>Mobile:</h3> +420 123 456 789
</li>
<li>
<h3>Facebook:</h3><a href="https://www.facebook.com/dave.j.le">www.facebook.com/dave.j.le</a>
</li>
</ul>
</div>
<div class="row border border-white rounded mb-3 team">
<div class="offset-col-1 col-5">
<h2 class="text-white">Peter Braun</h2><img class="profile-img" src="pictures/fatman.jpg" alt="Fatm Man" title="Really Fat Man">
</div>
<p class="text-white col-md-6">A big, beefy man with hardly any neck. You can recognize him easily thanks to his big mustache.</p>
<ul class="text-white col-md-6">
<li>
<h3>E-mail:</h3> <a href="mailto:jaumelopez@gmail.com">Peter-Braun@HP.com</a>
</li>
<li>
<h3>Mobile:</h3> +34 654 321 987
</li>
<li>
<h3>Facebook:</h3><a href="https://www.facebook.com/profile.php?id=713973021">www.facebook.com/Peter-Braun</a>
</li>
</ul>
</div>
<div class="row border border-white rounded mb-3 team">
<div class="offset-col-2 col-5">
<h2 class="text-white">Madame Zeroni</h2><img class="profile-img" src="pictures/madame.jpg" alt="Zeroni" title="Madame Zeroni">
</div>
<p class="text-white col-md-6">Madame Zeroni has dark skin and a very wide mouth. When she lookes at you, her eyes
seem to expand, and you feel like she is looking right through you.</p>
<ul class="text-white col-md-6">
<li>
<h3>E-mail:</h3> <a href="mailto:nikolograncic@gmail.com">Madame.Zeroni17@Holes.LouisSachar</a>
</li>
<li>
<h3>Mobile:</h3> +421 321 654 987
</li>
<li>
<h3>Facebook:</h3><a href="https://www.facebook.com/nikolo.grancic.3">www.facebook.com/MadameZeroni17</a>
</li>
</ul>
</div>
<div class="row border border-white rounded team">
<div class="offset-col-2 col-5">
<h2 class="text-white">Brother Eugene</h2><img class="profile-img" src="pictures/Eugene.jpg" alt="Brother Eugene" title="Brother Eugene">
</div>
<p class="text-white col-md-6"> Eugene, is like a piece of slightly yellow ivory; his high white
head is knotted fiercely by his old man’s scowl; his mouth is like a knife, his smile the flicker
of light across a blade. His face is like a blade, and a knife, and a flicker of light: it is delicate
and fierce, and scowls beautifully forever, and when he fastens his hard white fingers and his
scowling eyes upon a thing he wants to fix, he sniffs with sharp and private concentration
through his long, pointed nose…his hair shines like that of a young boy—it is crinkled and crisp
as lettuce. </p>
<ul class="text-white col-md-6">
<li>
<h3>E-mail:</h3> <a href="mailto:samuelvalenta@gmail.com">Eu-ge-ne@LookHomeward.com</a>
</li>
<li>
<h3>Mobile:</h3> +421 987 654 321
</li>
<li>
<h3>Facebook:</h3><a href="https://www.facebook.com/samuel.valenta">www.facebook.com/ThomasWolfe</a>
</li>
</ul>
</div>
</div>
</div>
<!-------------------------------FOOTER------------------------------>
<footer class="container-fluid w-100 text-light pt-3 footer footerOther">
<div class="container-fluid pt-3 pl-0 text-center text-md-left footerPart1 mb-3 p-3">
<div class="row">
<div class="col-12 text-center">
<h2>LET'S CONNECT!</h2>
</div>
<div class="col-12 text-center">
<p>Employers & Recruiters stay up to date with the latest product updates & annoucements </p>
</div>
<div class="col-12 text-center">
<form class="connection" action="">
<label class="conLabel" for="con">Enter your email adress:</label>
<input class="conField" type="text" name="con" id="con">
<input class="conButton" type="submit" value="SUBMIT"> </form>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-4 mb-md-0 mb-0">
<ul class="list-unstyled d-inline d-flex justify-content-center">
<li>
<a href="https://www.facebook.com/"><img class="img-fluid" src="pictures/facebook.png" alt="facebook" title="Visit Facebook"></a>
</li>
<li>
<a href="https://www.instagram.com/"><img class="img-fluid" src="pictures/instagram.png" alt="instagram" title="Visit Instagram"></a>
</li>
<li>
<a href="https://twitter.com/"><img class="img-fluid" src="pictures/twitter.png" alt="twitter" title="Visit Twitter"></a>
</li>
<li>
<a href="https://www.youtube.com/"><img class="img-fluid" src="pictures/youtube.png" alt="youtube" title="Visit Youtube"></a>
</li>
</ul>
</div>
</div>
<!-- FOOTER COPYRIGHT-->
<div id="copyright" class="row justify-content-center align-self-bottom d-flex pb-3 ">© 2018 Copyright: David Le's Company </div>
</footer>
</body>
</html>