JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test">
	<img class="sfv1" src="http://i.imgur.com/3VWKopF.jpg">
	<div class="title title1">
		<h2>Great value<br/> <strong>Spanish Properties</strong><br/> starting at ÂŁ65k</h2>
	</div>
	<div class="title title2">
		<h2>Stunning properties in <br/><strong>Costa del Sol, <br/>Blanca & Murcia</strong></h2>
	</div>
	<div class="title title3">
		<h2>Over <strong>10,000 <br/>Spanish properties sold</strong></h2>
	</div>
	<a class="click_through click_through1" href="/">View here</a>
	<a class="click_through click_through2" href="/">Learn more</a>
</div>

CSS

.test {
	    height: 250px;
	    position: relative;
	    width: 300px;
	    overflow: hidden;
	}
	.test div, .test a, .logo, .sfv2 {
		position: absolute;
	}
	.title {
	    bottom: 45px;
	    left: 5px;
	    right: 5px;
	}
	.title h2 {
	    color: #fff;
	    font-family: Helvetica,arial,sans-serif;
	    font-size: 21px;
	    font-weight: 400;
	    line-height: 1;
	    margin: 0;
	    text-align: center;
	}
	.click_through {
	    background-color: #fff200;
	    border-radius: 5px;
	    bottom: 12px;
	    box-shadow: 0 0 15px rgba(0, 0, 0, 0.35);
	    color: #ce1e25;
	    font-family: Helvetica,arial,sans-serif;
	    font-size: 14px;
	    font-weight: 700;
	    left: 0;
	    line-height: 1;
	    margin: 0 auto;
	    padding: 5px;
	    right: 0;
	    text-align: center;
	    width: 70px;
	    text-decoration: none;
	}
	.click_through1 {
		animation: tbio 7s ease-out 0s both;
		-moz-animation: tbio 7s ease-out 0s both;
		-webkit-animation: tbio 7s ease-out 0s both;
		-ms-animation: tbio 7s ease-out 0s both;
		-o-animation: tbio 7s ease-out 0s both;
	}
	.click_through2 {
		animation: tbio 7s ease-out 10s both;
		-moz-tbio tbio 7s ease-out 10s both;
		-webkit-tbio tbio 7s ease-out 10s both;
		-ms-tbio tbio 7s ease-out 10s both;
		-o-tbio tbio 7s ease-out 10s both;
		width: 80px;
	}
	.logo {
		top: 8px;
		left: 8px;
	}
	.title1 {
		animation: ltrio 6s ease 0s both;
		-moz-animation: ltrio 6s ease 0s both;
		-webkit-animation: ltrio 6s ease 0s both;
		-ms-animation: ltrio 6s ease 0s both;
		-o-animation: ltrio 6s ease 0s both;
	}
	.title2, .title3 {
		opacity: 0;
	}
	.title2 {
		animation: ltrio 6s ease 5.5s both;
		-moz-animation: ltrio 6s ease 5.5s both;
		-webkit-animation: ltrio 6s ease 5.5s both;
		-ms-animation: ltrio 6s ease 5.5s both;
		-o-animation: ltrio 6s ease 5.5s both;
	}
	.title3 {
		animation: ltrio 6s ease 10s both;
		-moz-nimation: ltrio 6s ease 10s both;
		-webkit-nimation: ltrio 6s ease 10s both;
		-ms-onimation: ltrio 6s ease 10s...