JSFiddle - React, Tailwind, and code Playground

HTML

<<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">

<<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">


<div class="container-fluid">
      
    <br><p class="p-head">GALLERY</p>
        <hr class="p-div">
        <div class="row">
			<div class="col-md-3">
			
			</div>
            <a href="#"><div class="col-md-3 padding-gallery">
                <div class="gallery-bg"><i class="fa fa-lightbulb-o"></i><br><p>Prom</p></div>
            </div></a>
            <a href="#"><div class="col-md-3 padding-gallery">
                <div class="gallery-bg"><i class="fa fa-tree" aria-hidden="true"></i><br><p>Great Outdoors</p></div>
            </div></a>
			<div class="col-md-3">
			
			</div>
        </div>    
</div>
<div class="container-fluid">
        <div class="row">
			<div class="col-md-3">
			
			</div>
            <a href="#"><div class="col-md-3 padding-gallery">
                <div class="gallery-bg"><i class="fa fa-building-o" aria-hidden="true"></i><br><p>City Slickers</p></div>
            </div></a>
            <a href="#"><div class="col-md-3 padding-gallery">
                <div class="gallery-bg"><i class="fa fa-users" aria-hidden="true"></i><br><p class="gallery-text">Besties Shoots</p></div>
            </div></a>
			<div class="col-md-3">
			
			</div>
        </div>    
</div>

CSS

.gallery-bg {
	
	border:1px solid black;
	background-color:#2E0854;
	height:300px;
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	color:white;
	font-size:100px;
	text-shadow:0px 0px 5px #BA55D3;
	transition:.4s ease-in-out;
	

}

.gallery-bg p {
	
	font-size:20px;
	font-family:exo;
	transition: opacity ease-in 0.25s;
	position:absolute;
	text-align: center;

	
}

.gallery-bg:hover {
	
    box-shadow:inset 0 0 0 25px #a74cbd;
	
}

.gallery-bg:hover .gallery-text {
	
	display:block;
	opacity:1;
	
} 


.padding-gallery {
	
	padding:10px 10px 10px 10px;