JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrap">
    <div class="border">
        	<h1 class="hero-title">We make your website beautiful & usable </h1>
 <span class="attr">— Citation, ABC Inc</span>

    </div>
</div>

CSS

@import url(https://fonts.googleapis.com/css?family=Playfair+Display:400, 700, 900);
 body {
    background: url('https://source.unsplash.com/category/nature') no-repeat center center #333;
    color:#FFF;
    font-family:"Playfair Display", Georgia, serif;
    background-size:cover;
}
.wrap {
    max-width:1200px;
    margin:0 auto;
    padding:130px 20px;
}
.border {
    border:solid 10px #FFF;
    text-align:center;
    position:relative;
}
.attr {
    top:-45px;
    font-size:20px;
    display:block;
}
.hero-title {
    font-weight:700;
    font-size:90px;
    text-align:center;
    margin:0 50px;
    padding:0;
    top:-75px;
    display:inline-block;
}