JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<html lang="en">
<head>
    <title>InDa Rock</title>


    <script type="text/javascript" src="scripts/swfobject.js"></script>        
    <script type="text/javascript">
      var flashvars = {};
      flashvars.cssSource = "css/piecemaker.css";
      flashvars.xmlSource = "scripts/piecemaker.xml";
        
      var params = {};
      params.play = "true";
      params.menu = "false";
      params.scale = "showall";
      params.wmode = "transparent";
      params.allowfullscreen = "true";
      params.allowscriptaccess = "always";
      params.allownetworking = "all";
      params.ControlSize = "20px";
      
      swfobject.embedSWF('scripts/piecemaker.swf', 'piecemaker', '970', '391', '0', null, flashvars,    
      params, null);
    </script>
    
    <script>
          var slideToggle = function() {
         var mydiv = document.getElementById('piecemaker');
              if (mydiv.style.display === 'block' || mydiv.style.display === '')
                mydiv.style.display = 'none';
              else
                   mydiv.style.display = '';
          }
</script>
</head>
<body>

    <div class="header">
        <img src="css/indalogo.png">
    </div>        
    <?php include'includes/slideshow.php';?>

    <div class="wrapper content" >
    <h2>Welcome!</h2>
    <p>Welcome to InDa Rock! Our goal is to keep you connected to alot that is going on around Little Rock. Hence the title "InDa Rock."<br /> Below is a list of major events for the next few days!</p>
    </div>



    <div class="events">
        <div class="grid1">
            
            <a href="#">
            <h3 class="grid1">Event one..</h3> </a>        <br />
            <p class="grid1">Datehere</p>                <br />    
            <p class="grid1">Location</p>                <br /><br />    
            <p...

CSS

html{
    font-family: arial;
    background-image: url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/debut_light.png'); /*Image From SubtlePatterns.com*/
}

body{
    padding: 0px;
    margin-top: 0px;
}

div.header{
    margin-top: -1px;
    color: white;
    width: 950px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3px;

    padding-top: 10px;    
    padding-bottom: 25px;        
    padding-right: 10px;
    padding-left: 10px;

    /*Color:*/
    background-image: url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/debut_dark.png'); /*Image From SubtlePatterns.com*/

}

img.toggle{
    margin-top: -33px;
    margin-right: 3px;
    float: right;
    text-align: right;
    z-index: 101;
    height: 29px;
    width: 29px;
    
}

div.slideshow{
    z-index: 100;
    width: 970px;
    margin-left: auto;
    margin-right: auto
}
.wrapper.head{
    margin-top: 0px;
}

.wrapper{

    width: 950px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3px;
    padding: 10px;
    
    color: white;
    margin-left: auto;
    /*Color:*/
    background-image: url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/debut_dark.png'); /*Image From SubtlePatterns.com*/
}

.wrapper.content{
    margin-top: 0px;
}

div.events {
    width: 970px;
    margin-left: auto;
    margin-right: auto;
    
    text-align: left;   
}

div.grid1 {
    width: 220px;
    max-width: 220px;
    margin-right: 3px;
    float: left;
    padding:10px;
    background-image: url('http://subtlepatterns.subtlepatterns.netdna-cdn.com/patterns/debut_dark.png'); /*Image From SubtlePatterns.com*/
    margin-bottom: 3px;
}

div.grid1:nth-child(4n) {
    margin-right:0px;
    width: 221px;
    max-width: 221px;

}

div.gridbreak{
}

div.grid1 img {
}

div.grid1 a {
    color: white;
    text-decoration: none;
}

div.grid1 a:hover {
    color: white;
    text-decoration: underline;
}


div.grid1 p...