JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content"> 
    <div id="about"> 
        <h2>About</h2> 
            <p class="content-paragraph-left">Paragraaf 1 tekst.</p> 
            <p class="content-paragraph-right">Paragraaf 2 tekst.</p> 
        </div> <!-- about --> 
</div> <!-- content -->

CSS

.content { 
    width: 100%; 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    text-align: center;
    background: #f8f8f8;
    overflow: hidden;
} 

.content h2 { 
    background-color: #ff675f; 
    color: #ffffff; 
    line-height: 40px; 
    padding: 0 40px; 
    display: inline-block; 
    font-size: 30px; 
    text-transform: uppercase; 
    border-bottom: 3px solid #ffa39f; 
    margin-bottom: 80px; 
} 

.content p { 
    font-size: 14px; 
    line-height: 20px; 
    color: #44505b; 
    text-align: justify; 
} 

.content-paragraph-left { 
    width: 48%; 
    padding-right: 2%; 
    float: left; 
} 

.content-paragraph-right { 
    width: 48%; 
    padding-right: 2%; 
    float: right; 
} 

#about { 
    padding: 80px 180px 0px; 
    background-color: #ececec; 
} 

.clearfix { 
    clear: both; 
}