# Product info

### 3. Product info

> Module position:home-3
>
> Module suffix: Not used

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FZyCeNI0Yr0zCKteJX9So%2Fproduct-info.png?alt=media\&token=c0beaa9f-a159-49e2-b022-221c5aaf4d73)

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FMx6MLqlyqMeVR56od76z%2Flogo1.png?alt=media\&token=96bf9ee7-3bd1-4a60-bba0-6cc935620a70)

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2F6BcDYKyetXEo8a3FQ0Mm%2Flogo4.png?alt=media\&token=ad6a5fba-ef42-4478-aaae-73d7fcec8aa4)

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2F99iikQmyNGkAc7ueCZUg%2Flogo2.png?alt=media\&token=59cfdbb5-8bad-4fab-bc52-ffd1caa6039b)

![](https://299314993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrD6zkkWwg4W3S7sFogkq%2Fuploads%2FD3rhwoM66k4lqz5flO6M%2Fproduct-info1.png?alt=media\&token=ef5c9324-ed28-4983-8a5a-a5657e59dbb2)

Follow the below code to achive the above

```html
<!-- product info
================================================== -->

<div class="product-info">
<div class="text-center">
<h1>Services we offer</h1>
<p>A small river named Duden flows by their place and supplies it with the necessary regelialia.</p>
</div>
<div class="row">
<div class="col-sm-4">
<div class="product-container">
<div id="product-icon" class="product-icon">
<div class="call-icons"><i class="fa fa-users"></i></div>
</div>
<div class="product-heading">
<h3>Strategy &amp; Planning</h3>
<p class="product-discription">Decore nostro repudiandae mea ea, ne meliore menandri ius. Ex suscipit antiopam salutatus sed, nec ut utamur impetus docendi.Decore nostro repudiandae mea ea, ne meliore menandri ius.</p>
</div>
<div class="button-container"><a href="#" class="btn-lg readbutton"><i class="fa fa-chevron-right font-chev"></i>Read more </a></div>
</div>
</div>
<div class="col-sm-4">
<div class="product-container">
<div id="product-icon1" class="product-icon">
<div class="call-icons"><i class="fa fa-book"></i></div>
</div>
<div class="product-heading">
<h3>Branding &amp; Campaigns</h3>
<p class="product-discription">Decore nostro repudiandae mea ea, ne meliore menandri ius. Ex suscipit antiopam salutatus sed, nec ut utamur impetus docendi.Decore nostro repudiandae mea ea, ne meliore menandri ius.</p>
</div>
<div class="button-container"><a href="#" class="btn-lg readbutton"><i class="fa fa-chevron-right font-chev"></i> Read more </a></div>
</div>
</div>
<div class="col-sm-4">
<div class="product-container">
<div id="product-icon" class="product-icon">
<div class="call-icons"><i class="fa fa-desktop"></i></div>
</div>
<div class="product-heading">
<h3>Web &amp; Mobile</h3>
<p class="product-discription">Decore nostro repudiandae mea ea, ne meliore menandri ius. Ex suscipit antiopam salutatus sed, nec ut utamur impetus docendi.Decore nostro repudiandae mea ea, ne meliore menandri ius.</p>
</div>
<div class="button-container"><a href="#" class="btn-lg readbutton"><i class="fa fa-chevron-right font-chev"></i>Read more </a></div>
</div>
</div>
<div>&nbsp;</div>
</div>
</div>
```