<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div id="H_container">
<img id="H_image" src="C:\Users\BiT\Desktop\123.jpg" />
<div id="H_text">
<br />
<h2><strong>Компания "Интеллекта"</strong></h2>
<p>Ваш надежный партнер в аналитических решениях для бизнеса.</p>
<p>Мы работаем, чтобы наши программные продукты приносили вам пользу, помогали зарабатывать и принимать стратегически правильные решения. </p>
<p>Для достижения этого мы предлагаем услуги автоматизации бизнес-процессов и лучший стек технологий для сбора, обработки и анализа данных, в том числе Big Data.</p>
<p>При разработке ПО компания использует agile-методику управления проектами, ключевую роль в которой играют непрерывные релизы и получение обратной связи от заказчиков при каждой итерации.</p>
</div>
</div>
<div class="H_body">
<div>
<h1 style="font-family: 'times new roman', times, serif; text-align:center; margin-bottom: 20px; margin-top: 65px;">Основные направления</h1>
<div class="body_image">
<img src="/images/ImageForHeaderStr/Razrabotka%20vnedrenie%20i%20podderzka%20PO.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Разработка и внедрение ПО</p>
</div>
<div class="body_image">
<img src="/images/ImageForHeaderStr/Tehniceskaa%20podderzka.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Техническая поддержка</p>
</div>
<div class="body_image">
<img src="/images/ImageForHeaderStr/Biznes-analitika.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Бизнес-аналитика</p>
</div>
</div>
<div style="width:1230px;">
<div class="body_image">
<img src="/images/ImageForHeaderStr/Administrirovanie%20informacionnyh%20sistem.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Администрирование<br />информационных систем</p>
</div>
<div class="body_image">
<img src="/images/ImageForHeaderStr/Avtomatizacia%20biznes-processov.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Автоматизация бизнес-процессов</p>
</div>
<div class="body_image">
<img src="/images/ImageForHeaderStr/Podgotovka%20tehniceskoj%20dokumentacii%20i%20konsalting.png" width="150" height="150" style="margin: auto">
<p style="font-family: 'times new roman', times, serif; font-size:20px; text-align:center;">Подготовка технической<br />документации и консалтинг</p>
</div>
</div>
</div>
</div>
@media screen and (min-width: 1440px){
#H_container {
height: 600px;
width: 500px;
position: relative;
}
#H_image {
position: absolute;
left: 0;
top: 0;
}
#H_text {
z-index: 100;
position: absolute;
color: black;
font-family: 'times new roman', times, serif;
font-size:20px;
text-align: justify;
line-height: 1.9;
/* left: 150px;*/
/* top: 350px;*/
}
.H_body {
width: 1230px;
margin-top: 15px;
}
.body_image{
width:400px;
height:250px;
display:inline-block;
vertical-align: top;
}
}
@media screen and (min-width: 660px){
#H_container {
height: 600px;
width: 500px;
position: relative;
}
#H_image {
position: absolute;
left: 0;
top: 0;
}
#H_text {
z-index: 100;
position: absolute;
color: black;
font-family: 'times new roman', times, serif;
font-size:20px;
text-align: justify;
line-height: 1.9;
/* left: 150px;*/
/* top: 350px;*/
}
}
