JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<meta charset="UTF-8">
<html>
	<head><title>Página de Contato</title>
		<link rel="stylesheet" href="styles.css">
	</head>
<body>
<div id="site">
	<div id="barramenu">menu menu menu menu</div>
	<div id="backgroundSlider">
	slider
		<form>
			Nome: <input type="text" name="nome"/><br>
			Email: <input type="email" name="email"/><br>
			Mensagem: <input type="text" name="menssagem"/><br>
			<input class="button" type="submit" value="Enviar"/>
		</form>
	</div>
	<div id="backgroundInfo">
	Background info
	</div>
	<div id="rodape">rodape</div>

</div>
</body>
</html>

CSS

*{
	background-color:   #FFF;
	margin: 0px;
	padding: 0px;
}
#site{

}
/*#barramenu{
	background: -o-linear-gradient(top,#3e779d,#65a9d7);
	background: -moz-linear-gradient(top, #3e779d, #606060);
   background: -webkit-linear-gradient(top, #3e779d, #606060);
   background: -ms-linear-gradient(top, #3e779d, #606060);
   box-shadow: rgba(0,0,0,1) 0 1px 0;
	width: 100%;
   margin-bottom: 15px;
	height: 100px;
   
}*/
#barramenu{
   background: #fff;
   width: 100%;
   height: 100px;
}
   #backgroundSlider{
      width: 100%;
      background: #000;
      height: 300px;
   }
#slider{
   width: 95%;
   height: 300px;
   background: #400000 ;
   margin-left: auto;
   margin-right: auto;
   }
   #rodape{

      width: 100%;
      height: 200px;
      background: #D8D8D8;
      float: left;
      margin: 0px;
      padding: 0px;
   }
   #backgroundInfo{
      width: 100%;
      height: 250px;
      background: -moz-linear-gradient(top,#E8E8E8, #D0D0D0); 
      padding-bottom: 50px;
   }
   .caixaInfo{
      width: 200px;
      height: 250px;
      background: #F8F8F8  ;
      opacity: 0.3;
      filter: alpha(opacity=30);
      margin-left: 32px;
      margin-top: 20px;
      margin-bottom: 20px;
      float: left;
   }
   .caixaInfoTexto{
      width: 200px;
      height: 200px;
      position: relative;
      margin-left: 32px;
      margin-top: 20px;
      margin-bottom: 20px;

   }
   #conteudoInfo{
      
      background: -moz-linear-gradient(top,#fff,#D0D0D0);
   }
   
   /*Botões*/
   .button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 6.5px 13px;
   -webkit-border-radius: 3px;
   -moz-border-radius: 10px;
  ...