JSFiddle - React, Tailwind, and code Playground

HTML

<!--Body-->
<div id="bodyContainer">

	<div id="indexSpotlightContainer">
    	SLIDER
    </div>
    
    <div class="indexBlockDivider"></div>
    
    <div id="indexBlockContainer1">
    	<div class="indexInfoBlock">
        	BLOCK1
        </div>
    </div>
    
    <div class="indexBlockDivider"></div>
    
    <div id="indexBlockContainer2">
    	BLOCK2
    </div>
    
    <div class="indexBlockDivider"></div>
    
    <div id="indexBlockContainer3">
    	<div class="indexSpotContainer1">
        	BLOCK3
        </div>
        <div class="indexSpotContainer2">
        	BLOCK4
        </div>
        <div class="indexSpotContainer3">
        	BLOCK5
        </div>
    </div>
    
</div>
<!--Body-->

CSS

#bodyContainer { width:1024px; height:auto; margin:auto; background-color:#F00; /* padding-bottom:30px; position:absolute; background-color:#F00;*/  }

#indexSpotlightContainer { width:1024px; height:100px; background-color:#F00; margin:auto; }
.indexBlockDivider { width:1024px; height:10px; background-color:#FFF; float:left; }

#indexBlockContainer1 { width:1024px; height:270px; background-color:#7581bf; float:left; }
.indexInfoBlock { width:964px; height:215px; float:left; margin-left:30px; margin-top:27px; }

#indexBlockContainer2 { width:1024px; height:270px; background-color:#7581bf; float:left; }

#indexBlockContainer3 { width:1024px; height:270px; float:left; background-color:#FFF; }
.indexSpotContainer1 { width:334px; height:270px; float:left; margin-right:11px; background-color:#7581bf; }
.indexSpotContainer2 { width:334px; height:270px; float:left; margin-right:11px; background-color:#7581bf; }
.indexSpotContainer3 { width:334px; height:270px; float:left; background-color:#7581bf; }

JavaScript

$("[class^=index], [id^=index]").css({
    "width":"0px",
    "height":"0px",
    "margin":"2px",
    "padding":"2px",
    "float":"left"
})
.filter(function() {
  return /^indexInfoBlock/.test(this.className)
})
.animate({
    width:"964px",
    height:"215px"
}, 5000)
.addBack()
.filter(function() {
  return /^indexBlockDiviver|indexSpotlightContainer/.test(this.id)
})
.animate({
    width:"1024px",
    height:"100px"
}, 5000)

.addBack()
.filter(function() {
  return /^indexBlockDiviver/.test(this.className)
})
.animate({
    width:"1024px",
    height:"10px"
}, 5000)
.addBack()
.filter(function() {
  return /^indexBlockContainer/.test(this.id)
})
.animate({
    width:"1024px",
    height:"270px"
}, 5000)
.addBack()
.filter(function() {
  return /^indexSpotContainer/.test(this.className)
})
.animate({
    width:"334px",
    height:"270px"
}, 5000)