-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
205 lines (186 loc) · 8.13 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
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
200
201
202
203
204
205
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="normalize.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<!--HEADER-->
<header id="header">
<div class="wrapper">
<div class="header-top">
<div id="logo">
<a href="/" class="logo-link"><img src="img/logo.png"></a>
</div>
<nav class="header-nav">
<ul>
<li><a href="#">home</a></li>
<li><a href="#">about</a></li>
<li><a href="#">work</a></li>
<li><a href="#">process</a></li>
<li><a href="#">services</a></li>
<li><a href="#">testimonials</a></li>
<li><a href="#">contact</a></li>
</ul>
</nav>
</div>
<div class="header-bottom">
<div>
<h1>We Design and Develop</h1>
<div class="header-bottom-descr">We are a new design studio based in USA. We have over
20 years of combined experience, and know a thing or two
about designing websites and mobile apps.
</div>
<a href="#" class="contact-us">contact us</a>
</div>
</div>
<div class="heder-picture"><img src="img/"></div>
</div>
</header>
<!--CONTENT-->
<section class="about-us">
<h2>About Us</h2>
<div class="about-us-descr">Divide have don't man wherein air fourth. Own itself make have night won't make.
A you under Seed appear which good give. Own give air without fowl moveth dry first
heaven fruit, dominion she'd won't very all.
</div>
<div class="heder-picture"><img src="img/"></div>
</section>
<section class="proffessional-skills">
</section>
<section class="statistic">
</section>
<section class="gallery">
</section>
<section class="our-work-process">
<h2>Our Work Process</h2>
<div class="about-us-descr">Was years it seasons was there form he in in them together over that,
third sixth gathered female creeping bearing behold years.
</div>
</section>
<section class="category">
<div class="category-line">
<div class="category-item">
<img src="img/diamond.svg">
<div class="category-item-title">ui / ux design</div>
<div class="category-item-desc">Be set fourth land god darkness
make it wherein own
</div>
</div>
<div class="category-item">
<img src="img/arc.svg">
<div class="category-item-title">web development</div>
<div class="category-item-desc">A she'd them bring void moving
third she'd kind fill</div>
</div>
<div class="category-item">
<img src="img/phone.svg">
<div class="category-item-title">app / mobile</div>
<div class="category-item-desc">Dominion man second spirit he,
earth they're creeping</div>
</div>
<div class="category-item">
<img src="img/joy.svg">
<div class="category-item-title">game design</div>
<div class="category-item-desc">Morning his saying moveth it
multiply appear life be</div>
</div>
</div>
<div class="category-line">
<div class="category-item">
<img src="img/plane.svg">
<div class="category-item-title">SEO / marketing</div>
<div class="category-item-desc">Give won't after land fill creeping
meat you, may</div>
</div>
<div class="category-item">
<img src="img/star.svg">
<div class="category-item-title">photography</div>
<div class="category-item-desc">Creepeth one seas cattle grass
give moving saw give</div>
</div>
<div class="category-item">
<img src="img/magic-wand.svg">
<div class="category-item-title">graphic design</div>
<div class="category-item-desc">Open, great whales air rule for,
fourth life whales</div>
</div>
<div class="category-item">
<img src="img/paint-bucket.svg">
<div class="category-item-title">illustrations</div>
<div class="category-item-desc">Whales likeness hath, man kind
for them air two won't</div>
</div>
</div>
</section>
<section class="review">
</section>
<section class="trade-marks">
<a href="#" class="trade-marks-img"><img src="img/"></a>
<a href="#" class="trade-marks-img"><img src="img/"></a>
<a href="#" class="trade-marks-img"><img src="img/"></a>
<a href="#" class="trade-marks-img"><img src="img/"></a>
<a href="#" class="trade-marks-img"><img src="img/"></a>
</section>
<section class="need-a-project">
<div class="wrapper">
<h2>Need a Project?</h2>
<div class="need-a-project-title">Let us know what you're looking for in an agency. We'll take a look and see
if this could be the start of something beautiful.
</div>
<form class="need-a-project-form" action="#" method="POST" name="form">
<div class="need-a-project-form-line">
<input type="text" name="name" placeholder="Your Name">
<input type="text" name="email" placeholder="Your Email">
</div>
<input type="text" name="title" placeholder="Your Title">
<input type="text" name="comment" placeholder="Your Comment">
<button class="send message" type="button">send message</button>
</form>
</div>
</section>
<!--FOOTER-->
<footer id="footer">
<div class="wrapper">
<section class="footer-rights">
<div class="footer-rights-company">Piroll Design, Inc.
</div>
<div class="footer-rights-text">© 2017 Piroll. All rights reserved. Designed by robirurk.
</div>
</section>
<section class="footer-contact">
<ul class="footer-contact-conteiner">
<li class="footer-contact-email"><a href="mailto:[email protected]">[email protected]</a></li>
<li class="footer-contact-phone"><a href="tel:+44 987 065 908 ">+44 987 065 908</a></li>
</ul>
</section>
<section class="footer-nav">
<ul class="footer-nav-1">
<li><a href="#">Projects</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Carreer</a></li>
</ul>
<ul class="footer-nav-2">
<li><a href="#">News</a></li>
<li><a href="#">Events</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Legals</a></li>
</ul>
</section>
<section class="footer-social">
<div class="footer-social-links">
<a href="#" class="footer-about-social">Facebook</a>
<a href="#" class="footer-about-social">Twitter</a>
<a href="#" class="footer-about-social">Instagram</a>
<a href="#" class="footer-about-social">Dribbble</a>
</div>
</section>
</div>
</footer>
</body>
</html>