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>
CSS
html, body {
height: 95%;
width: 95%;
padding: 0;
margin: 0;
background: black
}
.holder {
position:absolute;
left:5px;
opacity:1;
width:98%;
height:90%;
border-style:solid;
border-width:thin;
border-color:#fff;
margin-top:5px;
text-align:center;
}
.multi {
position:absolute;
opacity:0.5;
width:90%;
margin-left:5%;
height:50px;
top:75%;
right:0;
left:0;
margin-left: auto;
margin-right: auto;
text-align:center;
font-size:26px;
font-family:Arial, Helvetica, sans-serif;
color:#fff;
vertical-align:middle;
line-height:50px;
border-style:solid;
border-width:thin;
border-color:#fff;
}
.music {
position:absolute;
opacity:1;
width:90%;
margin-left:5%;
height:50px;
top:60%;
right:0;
left:0;
margin-left: auto;
margin-right: auto;
text-align:center;
font-size:26px;
font-family:Arial, Helvetica, sans-serif;
color:#fff;
vertical-align:middle;
line-height:50px;
border-style:solid;
border-width:thin;
border-color:#fff;
}
@media only screen and (min-device-width: 700px){
.holder {
position:absolute;
left:0;
right:0;
top:0px;
opacity:1;
width:800px;
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;
}
.multi {
position:absolute;
left:20px;
/*bottom:20px;*/
top:445px;
opacity:.5;
width:200px;
height:50px;
margin-left: 0;
margin-right: 0;
text-align:center;
font-size:26px;
font-family:Arial, Helvetica, sans-serif;
color:#fff;
vertical-align:middle;
line-height:50px;
border-style:solid;
border-width:thin;
border-color:#fff;
}
.music {
position:absolute;
opacity:1;
right: 20px;
top:445px;
width:200px;
height:50px;
text-align:center;
font-size:26px;
font-family:Arial, Helvetica, sans-serif;
color:#fff;
vertical-align:middle;
line-height:50px;
border-style:solid;
border-width:thin;
border-color:#fff;
}
}