JSFiddle - React, Tailwind, and code Playground

HTML

<div class="whatwedo">
        <h3>What We Do</h3> 
        <hr>
        <p>We analyse and report on user behaviour in online forms and checkouts using powerful, interactive reports that show you what to fix.</p>
        
            <div class="inner">

                <div class="container">
                    <div id="img-holder"></div>
                    <p id="img">Installed in seconds, see your first data in minutes.</p>
                </div>

                <div class="container">
                    <div id="img-holder"></div>
                    <p id="img">Real-time reporting on who is in your checkout/forms.</p>
                </div>
        
                <div class="container">
                    <div id="img-holder"></div>
                    <p id="img">When you make a chance to your checkout,  we annotate it.</p>
                </div>
                
                <div class="container">
                    <div id="img-holder"></div>
                    <p id="img">Works "out of the box" on 99% of all checkouts and forms.</p>
                </div>

            </div>
        
    </div>

CSS

/* base.css */
* { box-sizing: border-box; font-family: 'Arial', sans-serif; }
body, html { min-height: 100%; background-color: #366e81; }
body, html, div, nav, section, ul, li, header { float: left; margin: 0px; padding: 0px; }

/* What We Do.css */
div.whatwedo { box-sizing: border-box; margin: 0 auto; background-color: #366e81; padding: 100px; text-align: center; width: 100%; }
div.whatwedo .inner { float: none; }
div.whatwedo h1 { color: #ffffff; font-family: 'Franklin Gothic', 'Arial', 'sans serif'; font-weight: lighter; font-size: 45px; }
div.whatwedo h2 { margin-top: -15; color: #8e8e8e; font-family: 'Franklin Gothic', 'Arial', 'sans serif'; font-weight: lighter; font-size: 25px; }
div.whatwedo h3 { margin-top: -15; color: #fff; font-family: 'Franklin Gothic', 'Arial', 'sans serif'; font-weight: lighter; font-size: 20px; }
div.whatwedo p { margin: 0 auto; color: #ffffff; font-family: 'Franklin Gothic', 'Arial', 'sans serif'; font-weight: lighter; font-size: 15px; max-width: 500px; }
div.whatwedo hr { border-bottom: 1px solid #fff; margin-bottom: 50px; width: 100px; }
div.whatwedo div.container { vertical-align: top; display: inline-block; text-align: center; }
div.whatwedo div.container img { margin: 50px 25px 0 25px; width: 231px; height: 231px; }
div.whatwedo div.container p { margin-top: 20px; display: block; max-width: 210px; }
div.whatwedo div.container div#img-holder { background-color: #ffffff; height: 200px; width:200px; margin: 25px 10px 10px 10px;}