JSFiddle - React, Tailwind, and code Playground

HTML

<section class="sessao-2">
        <div class="texto-sessao2">
            <h1>Um mundo de posibilidades</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.consectetur adipiscing
                elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo .</p>
        </div>
        <br/>
        <ul id="btn-sessao2">
            <li><a href="#">Conheça nossos serviços</a>
            </li>
        </ul>
</section>

<section class="sessao-3">
        <img src="http://blog.dudamobile.com/wp-content/uploads/2014/02/Viewing-platforms.png" alt="web-design" id="web-design" />
        
        <section class="section--blue wow fadeInRight" data-wow-offset="300">
            <div class="texto-sessao-3">
                <h1>Porque nos esolher?</h1>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.consectetur
                    adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo .</p>
                <br/>
                <a href="#" id="contato">Quem somos</a>
            </div>
        </section>
</section>

<section class="sessao-4">
        <div class="texto-sessao-4">
            <h1>Pode contar conosco sempre</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.consectetur adipiscing
               ...

CSS

h1 {
    margin: 0;
    padding: 0;
    font-size: 40px;
}

.sessao-2 {
    border-bottom: 5px solid #fff;
    background: url(https://clicksem.net/images/background_electronica.jpg) no-repeat;
    background-size: cover;
}

.texto-sessao2 {
    text-align: left;
    color: #fff;
    font-family: Gabriola;
    z-index: 2;
    margin-left: 5%;
    margin-top: 10%;
}
.texto-sessao2 p {
    /*width: 40%;*/
    width: 500px;
    font-size: 1.2em;
    margin-top: -3%;
}
#btn-sessao2 li {
    display: inline;
}
#btn-sessao2 li a {
    margin: 20px;
    color: #fff;
    border: 2px solid #fff;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    font-family: Gabriola;
    font-size: 1.2em;
    padding: 10px 15px;
}
#btn-sessao2 li a:hover {
    background-color: #fff;
    color: #222;
}

/* ######## Section-3 ####### */

.bg-sessao3 {
    height: auto;
    width: 100%;
    background-repeat: no-repeat;
    z-index: -2;
}
#web-design {
    width: 550px;
    margin-top: 2%;
}
.texto-sessao-3 {
    font-family: Gabriola;
    text-align: left;
}
.texto-sessao-3 p {
    font-size: 1.2em;
    width: 500px;
}
#contato {
    color: #222;
    border: 2px solid #222;
    -webkit-border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    font-family: Gabriola;
    font-size: 1.2em;
    padding: 10px 25px;
    clear: both;
}
#contato:hover {
    background-color: #222;
    color: #fff;
}

/* ######## Section-4 ####### */

.sessao-4 {
    background: url(https://clicksem.net/images/background_electronica.jpg) no-repeat;
    background-size: cover;
}

.texto-sessao-4 {
    color: #fff;
    font-family: gabriola;
    text-align: left;
}
.texto-sessao-4 p {
    font-size: 1.2em;
    width: 500px;
}
#sobre {
    border: 2px solid #fff;
    color: #fff;
    font-size: 1.3em;
    -webkit-border-radius: 5px;
   ...