JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper"> 
 

<header> 
 

<img class="logo" alt="#" /> 
 

</header> 
  

<div id="home_slide" class="corners"></div> 
 

<div class="cell corners" style="float:left"> 
<h3>Facts & Fables</h3> 
</div> 
<div class="cell corners" style="float:left"> 
<h3>Book Free Appointment</h3> 
</div> 
<div class="cell corners" style="float:right; margin:0"> 
<h3>Eligible for Grant?</h3> 
</div> 
 

<div style="clear:both; height:30px"></div> 
 

<div class="cell corners" style="float:left; width:570px"></div> 
<div class="cell corners" style="float:right; margin:0"> 
<h3>Testimonials</h3> 
</div> 
 

<div style="clear:both; height:30px"></div> 
 

 

 

 

 

 

 

 

 

 

 

 

 

 

<div class="push"></div> 
</div> 
 

<div class="footer"> 
 

</div> 
<img src="http://www.beulahprint.ie/images/bkg_clouds.png" id="bkg_clouds" alt="#" />
<img src="http://www.beulahprint.ie/images/footer_clouds.png" id="footer_clouds" alt="#" />
<img src="http://www.beulahprint.ie/images/hills.gif" id="hills" alt="#" />

CSS

@charset "UTF-8";  * { margin:0; padding:0 } html, body { height:100% } a { text-decoration:none } a img { border:0 } body { background:#CCEEFF; background-image:url(images/bkg_gradient.png); background-repeat:repeat-x } .wrapper { width:960px; min-height:100%; height:auto !important; height:100%; margin: 0 auto -350px } .push { height:350px } .corners { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -khtml-border-radius: 10px } header { display:block; margin:30px 0 30px 0; overflow:hidden }    /************************************************************************************************************************************************************      BACKGROUND IMAGES      ************************************************************************************************************************************************************/  #footer_clouds { position:fixed; bottom:162px; left:50%; margin-left:-875px; z-index:-9999 } #bkg_clouds { position:fixed; top:100px; left:50%; margin-left:-700px; z-index:-9999 } #hills { position:fixed; bottom:100px; left:50%; margin-left:-700px; z-index:1 }        /************************************************************************************************************************************************************      HEADER ELEMENTS      ************************************************************************************************************************************************************/   .logo { float:left; height:80px; width:120px }     /************************************************************************************************************************************************************      MAIN ELEMENTS      ************************************************************************************************************************************************************/  #home_slide { background:#88DDFF; opacity:0.3; height:290px; width:900px; margin:0 30px 30px 0; padding:30px } .cell {...