JSFiddle - React, Tailwind, and code Playground

HTML

<title> Wandercraft Network </title>


<body>

<img src="https://dl.dropboxusercontent.com/u/85261154/WN_Banner.png" border="0px" class="banner">

    <div id="page-wrap">
        <section class="slide-up-boxes">
            <a href="www.reddit.com">
        <img src="https://dl.dropboxusercontent.com/u/85261154/PVP.png">
        <div> 
        <h5> <img src="http://www.backbonetechnology.com/media/blog-html5-logo.png"> </h5>
         </div>
        </a>
        </section>

    <section class="slide-up-boxes">
        <a href="www.reddit.com">
        <img src="https://dl.dropboxusercontent.com/u/85261154/Kingdoms.png">
        <div> 
        <h5> <img src="http://www.backbonetechnology.com/media/blog-html5-logo.png"> </h5>
         </div>
        </a>
    </section>

        <section class="slide-up-boxes">
        <a href="www.reddit.com">
        <img src="https://dl.dropboxusercontent.com/u/85261154/Survival.png">
        <div> 
        <h5> <img src="http://www.backbonetechnology.com/media/blog-html5-logo.png"> </h5>
         </div>
        </a>
        </section>
            <section class="slide-up-boxes">
            <a href="www.reddit.com">
            <img src="https://dl.dropboxusercontent.com/u/85261154/Factions.png">
            <div> 
            <h5> <img src="http://www.backbonetechnology.com/media/blog-html5-logo.png"> </h5>
             </div>
            </a>
        </section>
                <div style="clear:both;"></div>
   </div>
           	   
</body>

CSS

#page-wrap{
    width:620px;
    margin:0px auto;
}
.slide-up-boxes a {
    display:block;
    width:300px;
    height:300px;
    background: #eee;
    overflow:hidden;
}
.slide-up-boxes h5 {
    height:300px;
    width:300px;
    text-align:center;
    line-height:150px;
    -webkit-transition: margin-top 0.3s linear;
    background-color:#white;
}
.slide-up-boxes a:hover h5 {
    margin-top:-300px;
}
.slide-up-boxes div {
    text-align:center;
    height:300px;
    width:300px;
    opacity:0;
    background-color:orange;
    -webkit-transform: rotate(6deg);
    -webkit-transition: all 0.2s linear;
}
.slide-up-boxes a:hover div {
    -webkit-transform: rotate(0);
    opacity:1;
}

.slide-up-boxes {
 margin:5px;
 width:300px;
 float:left;
}

.banner{
margin:0px auto;
display:block;
padding:15px;
width:1000px;
height:300px;
}