-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
207 lines (182 loc) · 8 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
206
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Главная</title>
<link href='https://fonts.googleapis.com/css?family=PT+Sans:400,700&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/live.js"></script>
</head>
<body>
<!-- ШАПКА -->
<header class="nav">
<div class="container">
<a href="index.html" class="logo">
<img src="img/truck_icon.png" height="36" width="47" alt=""/>
<p><b>Спецтех</b>24</p>
</a>
<nav class="main-nav">
<ul>
<li><a href="index.html">О компании</a></li>
<li><a href="catalog.html">Услуги</a></li>
<li><a href="">Портфолио</a></li>
<li><a href="contacts.html">Контакты</a></li>
<li class="call"><a href="">Заказать звонок</a></li>
</ul>
</nav>
</div>
</header>
<main>
<!-- subheader -->
<section class="promo">
<div class="container-subhead">
<h1 class="promo-title">ВМЕСТЕ МЫ СПРАВИМСЯ!</h1>
<h2 class="promo-text">Спецтех24 – это сеть пунктов аренды спецтехники Cat, оборудования и специализированных инструментов для выполнения большинства видов работ.</h2>
<a href="catalog.html" class="btn btn-promo" src="">Перейти в каталог<span><img src="img/next-btn-icon.png" height="19" width="13" alt="" class="next"/></span></a>
</div>
</div>
</section>
<!-- форма заказать консультацию -->
<section class="make-order">
<div class="container">
<p class="make-order-title">Закажите бесплатную консультацию по подбору подходящей техники</p>
<form action=""><p>
<input type="text" value="Как вас зовут?"/>
<input type="text" value="Номер для связи"/>
<input type="text" value="Выберите дату" />
<input type="submit" value="Заказать консультацию">
</p>
</form>
</div>
</section>
<!-- блок преимущества -->
<section class="advantages bgcwhite">
<div class="container bgcwhite">
<i class="sprite sprite-advantage-tools"></i>
<div class="advantages-item tools ">
<p>Техника проходит обязательное обслуживание перед каждым выездом</p>
</div>
<i class="sprite sprite-advantage-worker"></i>
<div class="advantages-item worker">
<p>Все машины оборудованы спец. сигналами, для предупреждения аварий</p>
</div>
<i class="sprite sprite-advantage-border"></i>
<div class="advantages-item border">
<p>Привезем модные строительные ограждения к каждому заказу от 20 000</p>
</div>
<i class="sprite sprite-advantage-operator"></i>
<div class="advantages-item operator">
<p>С техникой приедут квалифицированные операторы и водители</p>
</div>
</div>
</section>
<!-- вся техника и спецпредложения -->
<section class="technic-and-price">
<div class="container">
<!-- вся техника -->
<nav class="technic-nav">
<h2 class="subtitle">Вся техника</h2>
<ul>
<li><a href="">Гусеничные экскаваторы</a></li>
<li><a href="">Колесные экскаваторы</a></li>
<li><a href="">Мини-экскаваторы</a></li>
<li><a href="">Гусеничные бульдозеры</a></li>
<li><a href="">Автокраны</a></li>
<li><a href="">Фронтальные погрузцики</a></li>
<li><a href="">Навесное оборудование</a></li>
<li><a href="">Дизельгенераторы</a></li>
</ul>
</nav>
<!-- спецпредложения -->
<div class="offers">
<h2 class="subtitle">Спецпредложения</h2>
<table class="special-price-table">
<tr class="table-title">
<th>Позиция для аренды</th>
<th>За смену</th>
<th>За неделю</th>
<th>За месяц</th>
</tr>
<tr class="table-data">
<td>Мини-экскаватор VOLVO</td>
<td>5 000</td>
<td>25 000</td>
<td>60 000</td>
</tr>
<tr class="white">
<td>Экскаватор VOLVO</td>
<td>3 000</td>
<td>15 000</td>
<td>40 000</td>
</tr>
<tr class="table-data">
<td>Грузовик VOLVO</td>
<td>5 000</td>
<td>25 000</td>
<td>60 000</td>
</tr>
<tr class="white">
<td>Мини-экскватор CAT</td>
<td>3 000</td>
<td>15 000</td>
<td>40 000</td>
</tr>
</table>
</div>
</div>
</section>
<!-- Цифры и рекомендации -->
<section class="numbers-and-comments">
<div class="container">
<!-- Спецтех в цифрах -->
<div class="numbers">
<h2 class="subtitle"><b>Спецтех</b> в цифрах</h2>
<ul class="numbers-list">
<li class="numbers-list-item"><span class="number-list-value">16</span> лет работы</li>
<li class="numbers-list-item"><span class="number-list-value">715</span> объектов построено</li>
<li class="numbers-list-item"><span class="number-list-value">108</span> машин в парке</li>
<li class="numbers-list-item"><span class="number-list-value">500+</span> клиентов</li>
</ul>
</div>
<!-- Нас рекомендуют -->
<div class="comments">
<h2 class="subtitle">Нас рекомендуют клиенты</h2>
<div class="comments-item">
<img src="img/clients-woman.png" alt="" class="comments-pic"/>
<blockquote>Спецтех24 - это надежные партнеры нашей компании, которые всегда выполняют работу быстро и еще у них отличное чувство юмора! Благодарим и рекомендуем.
<span class="comments-author">Оля Вольт, Реал-Строй</span>
</blockquote>
</div>
<div class="comments-item">
<img src="img/clients-man.png" alt="" class="comments-pic" />
<blockquote>Все виды работ, предусмотренные договором, компания выполнила на высоком профессиональном уровне, качествено, в срок, в соответствии с требованиями ООО "ТНН" рекомендует
<span class="comments-author">Григорий Безымянных, ТНН</span>
</blockquote>
</div>
</div>
</div>
</section>
<!-- Карта -->
<section class="map"></section>
</main>
<!-- подвал -->
<footer class="page-footer">
<div class="container">
<a href="" class="logo-footer">
<img src="img/truck_icon_white.png" height="36" width="47" alt="" />
<p><b>Спецтех</b>24</p>
</a>
<nav class="main-nav-footer">
<ul>
<li><a href="index.html">О компании</a></li>
<li><a href="catalog.html">Услуги</a></li>
<li><a href="">Портфолио</a></li>
<li><a href="contacts.html">Контакты</a></li>
<li><a href="" style="color: #ffcd34">Заказать звонок</a></li>
</ul>
</nav>
</div>
</footer>
</footer>
</body>
</html>