JSFiddle - React, Tailwind, and code Playground

HTML

<div class='holder'>
    	<div class='mainimage'></div>
    	<div class='multi'>Multimedia
        	<!--<a = href="http://google.com">Multimedia
            	<span class="underlink"></span>
         	</a> -->
         </div>
         <div class='music'>
         	<a = href="http://thoughtrender.com/music">Record Label
            	<span class="underlink"></span>
         	</a>
         </div>
        <div class='ref'>
			<a href="mailto:[email protected]">[email protected]</a>
		</div>
    </div>

CSS

html, body {
  	height: 95%;
  	width: 95%;
  	padding: 0;
  	margin: 0;
  	background: black url(http://thoughtrender.com/new/images/home_bk.jpg) center center no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	text-align:center;
}
.mainimage {
	width:50%;
    margin-left: 25%;
	display:absolute;
	margin-top:20px;
	/*margin-bottom:50px;*/
	height:449px;
	background-image: url(http://thoughtrender.com/new/images/logo_thr_circle.png);
	background-repeat: no-repeat; 
	background-position:center top;
	background-size:contain;
	z-index:10;
}

.holder {
	position:absolute;
	left:0;
	right:0;
	top:0px;
	opacity:.5;
	width:98%;
	height:545px;
	border-style:solid;
	border-width:thin;
	border-color:#fff;
	margin-top:30px;
	padding-top:0px;
	margin-left: auto;
    margin-right: auto;
	text-align:center;
	
}