-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
124 lines (119 loc) · 6.25 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
120
121
122
123
124
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="css/style.css"/>
<title>Home</title>
</head>
<body>
<div class="navbar">
<ul>
<li><a href="index.html" class="active">Home</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="book-online.html">Book Online</a></li>
</ul>
</div>
<div class="body1">
<h1>WEB folk</h1>
<span>Web Design Studio</span>
<p>
We dream, explore, create and craft<br/>progressive digital experiences
</p>
<pre class="dots">
.
.
.
</pre>
<div class="work">
<p>Work & Clients</p>
</div>
</div>
<div class="body2">
<div class="image"><img src="images/image_1.jpg"/></div>
<div class="image"><img src="images/image_2.jpg"/></div>
<div class="image"><img src="images/image_3.jpg"/></div>
<div class="image"><img src="images/image_4.jpg"/></div>
<div class="image"><img src="images/image_5.jpg"/></div>
<div class="image"><img src="images/image_6.jpg"/></div>
<div class="image"><img src="images/image_7.jpg"/></div>
<div class="image"><img src="images/image_8.jpg"/></div>
<div class="image"><img src="images/image_9.jpg"/></div>
<div class="image"><img src="images/image_10.jpg"/></div>
<div class="image"><img src="images/image_11.jpg"/></div>
<div class="image"><img src="images/image_12.jpg"/></div>
</div>
<div class="clear"></div>
<div class="body3">
<div class="bar">
<p>
Web design Web design Web design Web design Web design Web design Web design
</p>
</div>
<h2>Meet The Folks</h2>
<div class="twoPersons">
<div class="person">
<img src="images/Person_1.jpg">
<h3>Andreas</h3>
<span>CO Founder and Developer</span>
</div>
<div class="person">
<img src="images/Person_2.jpg">
<h3>Matt</h3>
<span>CO Founder and Designer</span>
</div>
</div>
<div class="twoPersons">
<div class="person">
<img src="images/Person_1.jpg">
<h3>Andreas</h3>
<span>CO Founder and Developer</span>
</div>
<div class="person">
<img src="images/Person_2.jpg">
<h3>Matt</h3>
<span>CO Founder and Designer</span>
</div>
</div>
<button>CONTACT US</button>
</div>
<div class="footer">
<div class="twoArticles">
<div class="article-left">
<h2>What We Do</h2>
<p>
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
</p>
<h3>. . .</h3>
</div>
<div class="article">
<h2>What We Do</h2>
<p>
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
</p>
<h3>. . .</h3>
</div>
</div>
<div class="twoArticles">
<div class="article-left">
<h2>What We Do</h2>
<p>
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
</p>
</div>
<div class="article">
<h2>What We Do</h2>
<p>
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
The idea is a box with zero width and height. The actual width and height of the arrow is determined by the width of the border. In an up arrow, for example, the bottom border is colored while the left and right are transparent, which forms the triangle.
</p>
</div>
</div>
<!-- <div class="clear"></div>-->
<button><a href="#top">BACK TO TOP</a></button>
</div>
<div class="copyrights"><p>© Copy Rights for Mohmmed Raafat</p></div>
</body>
</html>