JSFiddle - React, Tailwind, and code Playground

HTML

<article class="sup">
        
            <div id="barranav">
             <a href="http://www.linkficticio.com" target="blank">Sitio Ficticio</a>            
             </div>
             
            <div class="texto">
                <h1>Artículo Superior</h1> 
                <h3>Prueba de implementación de imágenes en "article".</h3>
            </div> 
             
    	</article> 
    
    	<article class="inf">
    
            <div id="barranav">
             <a href="http://www.linkficiticio.com" target="blank">Sitio Ficticio</a>
            </div>
            
            <div class="texto">
                <h1>Artículo Segundo</h1> 
                <h3>Prueba de implementación de imágenes en "article".</h3>
            </div> 
             
    	</article>

CSS

@charset "UTF-8";
/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Open+Sans);

html,body {
color:white;
  font-family:'Opens Sans',helvetica;  
  height:100%;
  width:100%;
  margin: 0px;
}

#barranav {
	padding: 10px 0px 10px 0px;
    background: rgba(0,0,0,0.3);
	color: #00bdff;
	width: 100%;
  text-align:center;
 font-size:1.3em; 
}

#barranav a {
	padding: 10px;
	border:none;
    color: white;
	color: #00bdff;
	text-decoration: none;
    
}

.sup {
    background: url(http://i86.servimg.com/u/f86/12/12/27/73/superi10.gif) no-repeat fixed top;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    height: 100%;
    width: 100% ;
    text-align: center;
}

.inf {
    background: url(http://i86.servimg.com/u/f86/12/12/27/73/inferi10.gif) no-repeat fixed;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size: contain;
    height: 100%;
    width: 100% ;
    text-align: center;
}

h1 {
	color: #FFEC01;
	font-weight: lighter;
	font-size: 3rem;
	}
	
h3 {
	color: #FFEC01;
	font-weight: lighter;
	}	
	
	
.texto {
margin: 30px 0px 30px 0px;	
padding: 10px;
background: rgba(255,255,255,0.5);
display: inline-block;
}