JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 uslugi">
<a href="#"><img src="http://placehold.it/250x250"></a>
<p>Отопление под ключ</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 uslugi">
<a href="#"><img src="http://placehold.it/250x250"></a>
<p>Обслуживание котлов</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 uslugi">
<a href="#"><img src="http://placehold.it/250x250"></a>
<p>Газификация</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-3 uslugi">
<a href="#"><img src="http://placehold.it/250x250"></a>
<p>Проектирование</p>
</div>
</div>
</div>
CSS
.uslugi{
text-align: center;
color: #648FC9;
text-transform: uppercase;
margin-top: 10px;
margin-bottom: 10px;
/**background-color: #648FC9;**/
border-radius: 0px;
padding: 20px 20px 20px 20px;
font-weight: 600;
}
.uslugi img{
height: 250px;
width: 250px;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.uslugi img:hover{
transform: scale(1.1);
}