JSFiddle - React, Tailwind, and code Playground

HTML

<main role="main">
  <article>
    <section id="welcome">
      <p>Content in here</p>
    </section>
  </article>
</main>

CSS

html,
body {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 16px;
  box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, .1);
  height: 100%;
  margin: 0;
  padding: 0;
  background: url('http://www.crossroadsaugusta.org/wp-content/uploads/2016/02/1418-56c10c706fcbb.jpg') fixed no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

main {
  width: 800px;
  margin: auto;
}

article {
  color: #fff;
  width: 580px;
  margin: 100px auto;
}

#welcome {
  font-size: 110%;
  border-radius: 25px;
  border: #fff solid 1px;
  margin-top: 50px;
  position: relative;
  }
#welcome::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left: 0;
  box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, .2);
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}

#welcome p {
  z-index: 999;
  margin: 10px;
}