JSFiddle - React, Tailwind, and code Playground

HTML

<section class="section-1">
    <div class="content-section-1">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis accusantium, eum soluta tempore repellendus, debitis quia, magni eligendi ipsa minima eveniet at, temporibus dolorem ab modi voluptatibus vero quaerat excepturi.</p>
    </div>
</section>

CSS

.section-1 {
    box-sizing: border-box;
    height: 100vh;
    padding: 110px 10% 50px 10%;
    min-height: 500px;
    background-color: aqua;
    background-image: url(http://s.hswstatic.com/gif/climbing-mount-everest-5.jpg);
    background-size: cover;
    background-position: center;
    -webkit-filter: blur(4px) opacity(0.6);
    filter: blur(4px) opacity(0.6);
}
.content-section-1 {
    padding: 15px;
    background-color: rgba(0, 0, 0, 0.6);
    -webkit-filter: none;
    filter: none;
    width: 100%;
    height: 100%;
}