JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">

    <div style="background-color:#000; color:#fff">
        TESTE
    </div>

    <section id="thumb" style="background-color:#fff;">

        <div class="thumb">
            <img src="https://www.google.com.br/images/branding/googleg/1x/googleg_standard_color_128dp.png" alt="" title="" />
            <h3>TESTE</h3>
            <p>TESTE</p>
        </div>

        <div class="thumb">
            <img src="https://www.google.com.br/images/branding/googleg/1x/googleg_standard_color_128dp.png" alt="" title="" />
            <h3>TESTE</h3>
            <p>TESTE</p>
        </div>

        <div class="thumb">
            <img src="https://www.google.com.br/images/branding/googleg/1x/googleg_standard_color_128dp.png" alt="" title="" />
            <h3>TESTE</h3>
            <p>TESTE</p>
        </div>

    </section>

    <div style="background-color:#000; color:#fff;">

        TESTE

    </div>

</div>

CSS

.thumb {
    width: 33%;
    height: auto;
    text-align: center;
    display: inline-block;
}

@media screen and (max-width:800px) {
    .thumb {
        vertical-align: middle;
        width: 100%;
        display: block;
    }
}