Загрузка данных
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>ООО "ВАЛЕНА"</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="logo">ООО "ВАЛЕНА"</div>
<div class="search">
<input type="search" placeholder="Поиск..." />
<svg viewBox="0 0 24 24"><path d="M21 21l-4.35-4.35m-5.3 1.32a7.2 7.2 0 1 1 0-14.4 7.2 7.2 0 0 1 0 14.4z" stroke="#999" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="contacts">
<div><a href="mailto:info@valena-gold.ru">sixseven@valena-gold.ru</a></div>
<div style="margin-top:5px"><a href="tel:+79227302600" class="phone">+7 (967) 067-67-67</a></div>
<div class="callback" onclick="alert('Заказ звонка оформлен!')">Заказать звонок</div>
</div>
</header>
<nav>
<a href="#" >О компании</a>
<a href="#" class="active">КОМПЛЕКТАЦИЯ</a>
<a href="#">Услуги</a>
<a href="#">Отзывы</a>
<a href="#">Новости</a>
<a href="#">Контакты</a>
</nav>
<section class="banner" aria-label="Баннер с описанием">
РАЗРАБОТКА И ИЗГОТОВЛЕНИЕ <br> ГОРНО-ОБОГАТИТЕЛЬНОГО <br> ОБОРУДОВАНИЯ
</section>
<section class="cards-container" aria-label="Услуги компании">
<article class="card">
<div class="card-header">ГОРНО-ОБОГАТИТЕЛЬНОЕ ОБОРУДОВАНИЕ</div>
<div class="card-image">
<img src="Hammer-Mill-Scrap-Steel-Iron-Metal-Plat-Crusher-Waste-Car-Vertical-Shredder-Copper-Aluminum-Can-Recycling-Machine.png" alt="Горно-обогатительное оборудование" />
</div>
<div class="card-text">
Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и ...
</div>
<a href="#">Подробнее</a>
</article>
<article class="card">
<div class="card-header">МЕСТОНАХОЖДЕНИЕ ПОЛЕЗНЫХ ИСКОПАЕМЫХ</div>
<div class="card-image">
<img src="i.jpg" alt="Местонахождение полезных ископаемых" />
</div>
<div class="card-text">
Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и ...
</div>
<a href="#">Подробнее</a>
</article>
<article class="card">
<div class="card-header">МЕСТОНАХОЖДЕНИЕ С ИСПОЛЬЗОВАНИЕМ<br>СКРУББЕР-БУТАРА</div>
<div class="card-image">
<img src="gfwargjxw5gx3bd16g39n74la9dhhcjk.png" alt="Скруббер-бутар" />
</div>
<div class="card-text">
Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и ...
</div>
<a href="#">Подробнее</a>
</article>
</section>
<div class="btn-center">
<button>СМОТРЕТЬ ВСЕ УСЛУГИ</button>
</div>
<hr class="divider">
<section class="about-company" aria-label="О компании">
<p><strong>ООО "Компания"</strong> — учрежденное одним или несколькими юридическими и/или физическими лицами хозяйственное общество, уставный капитал которого разделён на доли; участники общества не отвечают по обязательствам и не несут риск убытков, связанных с деятельностью общества, в пределах стоимости принадлежащих им долей в уставном капитале общества.</p>
<p>Общество с ограниченной ответственностью наряду с иными видами хозяйственных обществ, а также хозяйственных товариществ, производственных кооперативов, государственных и муниципальных унитарных предприятий является коммерческой организацией, то есть организацией, преследующей извлечение прибыли в качестве основной цели своей деятельности и распределяющей полученную прибыль между участниками.</p>
</section>
<section class="our-objects" aria-label="Наши объекты">
<h2 class="objects-title">НАШИ ОБЪЕКТЫ</h2>
<div class="objects-list">
<article class="object-card">
<img src="объект1.jpg" alt="Объект 1" />
<div class="object-info">
<b>Название объекта</b>
<p>Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и иных заинтересованных лиц</p>
<a href="#">СМОТРЕТЬ ВСЕ</a>
</div>
</article>
<article class="object-card">
<img src="1.9_9ayba5WxZsYJkTOLa4uJ5qXRzu6lPU62pZEuZgURQ.mi4cyG2cvISvVFaUeBRsm3AXGkvig9bZ6X2LS2OluiQ" alt="Объект 2" />
<div class="object-info">
<b>Название объекта</b>
<p>Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и иных заинтересованных лиц</p>
<a href="#">СМОТРЕТЬ ВСЕ</a>
</div>
</article>
<article class="object-card">
<img src="вагонетка.webp" alt="Объект 3" />
<div class="object-info">
<b>Название объекта</b>
<p>Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и иных заинтересованных лиц</p>
<a href="#">СМОТРЕТЬ ВСЕ</a>
</div>
</article>
<article class="object-card">
<img src="i (1).webp" alt="Объект 4" />
<div class="object-info">
<b>Название объекта</b>
<p>Осуществляется от имени и в интересах лиц, участвующих в деле: сторон, третьих лиц, заявителей и иных заинтересованных лиц</p>
<a href="#">СМОТРЕТЬ ВСЕ</a>
</div>
</article>
</div>
</section>
<section class="news-section" aria-label="Новости">
<h2 class="news-title">Новости</h2>
<div class="news-list">
<article class="news-card">
<img src="874afd20c82ccdbc8d3ca26a86448cbf.jpg" alt="Новость 1">
<div class="news-content">
Молодые горняцкие кадры возвращаются с наградами
<div class="news-date">22 марта 2024</div>
</div>
</article>
<article class="news-card">
<img src="874afd20c82ccdbc8d3ca26a86448cbf.jpg" alt="Новость 2">
<div class="news-content">
Молодые горняцкие кадры возвращаются с наградами
<div class="news-date">22 марта 2024</div>
</div>
</article>
<article class="news-card">
<img src="874afd20c82ccdbc8d3ca26a86448cbf.jpg" alt="Новость 3">
<div class="news-content">
Молодые горняцкие кадры возвращаются с наградами
<div class="news-date">22 марта 2024</div>
</div>
</article>
</div>
<div class="btn-news">
<button>СМОТРЕТЬ ВСЕ</button>
</div>
</section>
<section class="consultation" aria-label="Консультация по услугам">
<div class="consultation-content">
Инженерная компания с радостью ответит на ваши вопросы и подготовит расчет стоимости услуг и подготовит индивидуальное коммерческое предложение.
<br />
<button onclick="alert('Спасибо за ваш вопрос! Мы с вами свяжемся.')">ЗАДАТЬ ВОПРОС</button>
</div>
</section>
<footer>
<nav aria-label="Основное меню футера">
<a href="#">О компании</a>
<a href="#">КОМПЛЕКТАЦИЯ</a>
<a href="#">УСЛУГИ</a>
<a href="#">ОТЗЫВЫ</a>
<a href="#">НОВОСТИ</a>
<a href="#">КОНТАКТЫ</a>
</nav>
<div class="socials" aria-label="Социальные сети">
<a href="#" aria-label="Facebook" title="Facebook" style="fill:#666;">
<svg viewBox="0 0 24 24" width="22" height="22" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></svg>
</a>
<a href="#" aria-label="Twitter" title="Twitter" style="fill:#666;">
<svg viewBox="0 0 24 24" width="22" height="22" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"/></svg>
</a>
<a href="#" aria-label="Instagram" title="Instagram" style="fill:#666;">
<svg viewBox="0 0 24 24" width="22" height="22" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M7 2C4.25 2 2 4.25 2 7v10c0 2.75 2.25 5 5 5h10c2.75 0 5-2.25 5-5V7c0-2.75-2.25-5-5-5H7zm8 3a1 1 0 0 1 0 2 1 1 0 0 1 0-2zM12 7a5 5 0 1 1 0 10 5 5 0 0 1 0-10z"/></svg>
</a>
</div>
<div class="copyright">© 2016 INTEC.Site Design</div>
</footer>
</body>
</html>