-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
201 lines (201 loc) · 9.27 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Практика и GIT</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800&display=swap&subset=cyrillic" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body class="page">
<div class="page__header page__header_grey">
<header class="header">
<ul class="menu header__menu">
<li class="menu__item">
<a class="menu__link" href="">Home</a>
</li>
<li class="menu__item">
<a class="menu__link" href="#portfolio">Portfolio</a>
</li>
<li class="menu__item">
<a class="menu__link" href="#about">About Us</a>
</li>
<li class="menu__item">
<a class="menu__link" href="#contacts">Contact</a>
</li>
</ul>
</header>
</div>
<main class="page__content">
<div class="page__intro page__intro_grey">
<section class="intro">
<div class="intro__content">
<h1 class="intro__heading">Our strong<br>
<span class="intro__heading_style">organisation</span>
</h1>
<p class="intro__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed do eiusmod tempor incididunt ut labore et. ectetur adig ipis cing elit, sed do eiusmod tempor incididunt.</p>
<a class="action-button action-button_red" href="">Contact Us</a>
</div>
<a class="intro__image-link" href="">
<img class="intro__image" src="images/office.jpeg" alt="Фото офиса" width="551" height="356">
</a>
</section>
</div>
<section class="services">
<div class="services__lead">
<h2 class="services__heading" id="portfolio">Do you know we can<br> provide for you ?</h2>
<p class="services__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed do eiusmod tempor incididunt ut labore et.Lorem ni ipsum dolor sit amet, consectetur adipis cing elit, ed doi eiusmod tempor incididunt ut labore et.</p>
<a class="action-button action-button_white" href="">Learn More</a>
</div>
<div class="services__blocks">
<section class="service">
<h3 class="service__heading service__heading_manage">Management</h3>
<p class="service__text">Lorem ipsum dolor sitea amet, zixf conseit adipi cing elit, seddi do eiusmod btdempor in didunt utlae ore etioe.Lorem ipsum new idolor</p>
</section>
<section class="service">
<h3 class="service__heading service__heading_ux">UI /UX Design</h3>
<p class="service__text">Lorem ipsum dolor sitea amet, zixf conseit adipi cing elit, seddi do eiusmod btdempor in didunt utlae ore etioe.Lorem ipsum new idolor</p>
</section>
<section class="service">
<h3 class="service__heading service__heading_brand">Logo / Branding</h3>
<p class="service__text">Lorem ipsum dolor sitea amet, zixf conseit adipi cing elit, seddi do eiusmod btdempor in didunt utlae ore etioe.Lorem ipsum new idolor</p>
</section>
<section class="service">
<h3 class="service__heading service__heading_anim">Animation</h3>
<p class="service__text">Lorem ipsum dolor sitea amet, zixf conseit adipi cing elit, seddi do eiusmod btdempor in didunt utlae ore etioe.Lorem ipsum new idolor</p>
</section>
</div>
</section>
<section class="feature">
<div class="feature__header">
<h2 class="feature__heading">Feature products</h2>
<p class="feature__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit,sed do eiusmod tempor incididunt ut labore et.</p>
<hr class="header__line feature__line">
</div>
<ul class="products__filter">
<li class="products__item">
<a class="products__link products__link_active" href="">All</a>
</li>
<li class="products__item">
<a class="products__link" href="">Print template</a>
</li>
<li class="products__item">
<a class="products__link" href="">Web template</a>
</li>
<li class="products__item">
<a class="products__link" href="">User interface</a>
</li>
<li class="products__item">
<a class="products__link" href="">Mock-up</a>
</li>
</ul>
<div class="products">
<img class="product" src="images/work-1.jpg" alt="Скриншот макета">
<img class="product" src="images/work-2.jpg" alt="Скриншот макета">
<img class="product" src="images/work-3.jpg" alt="Скриншот макета">
<img class="product" src="images/work-4.jpg" alt="Скриншот макета">
<img class="product" src="images/work-5.jpg" alt="Скриншот макета">
<img class="product" src="images/work-6.jpg" alt="Скриншот интерфейса">
<img class="product" src="images/work-7.jpg" alt="Скриншот интерфейса">
<img class="product" src="images/work-8.jpg" alt="Скриншот интерфейса">
</div>
</section>
<section class="team">
<div class="team__header">
<h2 class="team__heading" id="about">Meet our team</h2>
<p class="team__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed dooing eiusmod tempor incididut labore Ui / Ux , print template.</p>
<hr class="header__line team__line">
</div>
<div class="team__members">
<img class="team__selected-photo" src="images/man.svg" alt="Фото сотрудника">
<div class="team__main-content">
<div class="team__selected-info">
<span class="team__selected-name">Mark waugh</span>
<p class="team__selected-about">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed dooing eiusmod tempor incididut labore Ui / Ux , print template.</p>
<div class="team__selected-links">
<a class="team__selected-link" href="">Facebook</a>
<a class="team__selected-link" href="">Dribble</a>
<a class="team__selected-link" href="">Behance</a>
<a class="team__selected-link" href="">Twiter</a>
</div>
</div>
<section class="members">
<div class="member">
<h3 class="member__name">sokina jue</h3>
<img class="member__photo" src="images/girl.svg" alt="Фото сотрудника">
</div>
<div class="member">
<h3 class="member__name">sokina jue</h3>
<img class="member__photo" src="images/girl.svg" alt="Фото сотрудника">
</div>
<div class="member">
<h3 class="member__name">sokina jue</h3>
<img class="member__photo" src="images/girl.svg" alt="Фото сотрудника">
</div>
<div class="member">
<h3 class="member__name">sokina jue</h3>
<img class="member__photo" src="images/girl.svg" alt="Фото сотрудника">
</div>
</section>
</div>
</div>
</section>
<section class="subscribe">
<div class="subscribe__header">
<h2 class="subscribe__heading">Design tips, tricks, and freebies. Delivered weekly.</h2>
<p class="subscribe__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed d</p>
</div>
<form class="subscribe__form" action="" method="GET">
<input class="subscribe__input" type="email" name="email" placeholder="Email Address..." required>
<button class="subscribe__button" type="submit">Subscribe</button>
</form>
</section>
<div class="feedback-contacts">
<div class="feedback__left-box"></div>
<section class="feedback">
<div class="feedback__header">
<h2 class="feedback__heading" id="contacts">Get in touch</h2>
<p class="feedback__text">Lorem ipsum dolor sit amet, consectetur adipis cing elit, sed do eiusmod tempor incididunt ut labore et.ur adipis cing elit, sed do eiusmod tempor incididunt ut labore et. ur adipis cing elit, sed do eiusmod tempor incididunt ut labore et.</p>
<hr class="header__line feedback__line">
</div>
<section class="feedback__body">
<form class="feedback__form" action="" method="GET">
<input class="feedback__input feedback__name" type="text" name="name" placeholder="Name" required>
<input class="feedback__input feedback__mail" type="email" name="email" placeholder="Your Mail" required>
<textarea class="feedback__input feedback__message" name="message" cols="30" rows="5" placeholder="Type your message" required></textarea>
<button class="feedback__button" type="submit">Send message</button>
</form>
</section>
</section>
<section class="contacts">
<h2 class="contacts__heading">Contact info</h2>
<address class="contacts__address">
<p class="contacts__line">Jalalabad 24 / A, Ambaarkhana, Sylhet, Bangladesh<br></p>
<p class="contacts__line">redwan@deviserweb.com<br></p>
<p class="contacts__line">(+88) 017 617 46373<br></p>
</address>
</section>
<div class="feedback__right-box contacts__decor"></div>
</div>
</main>
<footer class="footer">
<div class="footer__content">
<p>© Copyright @Junaed 2016, All rights reserved.</p>
<div class="footer__social-links">
<a class="footer__link" href="">
<img src="images/Twitter_Rounded_Solid.png" alt="Лого">
</a>
<a class="footer__link" href="">
<img src="images/LinkedIn_Rounded_Solid.png" alt="Лого">
</a>
<a class="footer__link" href="">
<img src="images/Google_Rounded_Solid.png" alt="Лого">
</a>
<a class="footer__link" href="">
<img src="images/Facebook_Rounded_Solid.png" alt="Лого">
</a>
</div>
</div>
</footer>
</body>
</html>