JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/localization/messages_pt_br.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="http://thefitties.co.uk/js/plugins/jquery-numeric.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://malsup.github.io/min/jquery.form.min.js"></script>
<script src="https://rawgithub.com/digitalBush/jquery.maskedinput/1.3.1/dist/jquery.maskedinput.min.js"></script>
<div id="msgErros" class="mensagens_erro"></div>
<form>
    <table width="95%" id="tabela_interna">
        <thead>
            <tr valign="middle">
                <th colspan="6">Relat&oacute;rio</th>
            </tr>
        </thead>
        <tbody>
            <tr valign="middle">
                <td width="14%" align="left" class="td_label">
                    <label for="dataInicialSolicitacao">Data de Solicitação Inicial</label>
                </td>
                <td width="25%" align="left" class="td_dados">
                    <input type="text" class="data skipOrFillDatasSolicitacao atLeastOneRequired" id="dataInicialSolicitacao" value="" size="12" name="filtro.dataInicialSolicitacao" />
                </td>
                <td width="12%" align="left" class="td_label">
                    <label for="dataFinalSolicitacao">Data de Solicitação Final</label>
                </td>
                <td width="25%" align="left" class="td_dados">
                    <input type="text" class="data skipOrFillDatasSolicitacao atLeastOneRequired" id="dataFinalSolicitacao" value="" size="12" name="filtro.dataFinalSolicitacao" />
                </td>
            </tr>
            <tr valign="middle">
                <td...

CSS

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #333333;
    margin: 0px;
    padding: 0px;
}
#tabela_interna {
    border: 1px solid #666666;
}
.tabela_interna {
    border: 1px solid #666666;
}
#tabela_interna th {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    font-weight: bold;
    color: #000000;
    background-color: #CCCCCC;
    padding: 3px;
    text-align: center;
}
.tabela_interna th {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    font-weight: bold;
    color: #000000;
    background-color: #CCCCCC;
    padding: 3px;
    text-align: center;
}
#tabela_interna tr {
    padding: 3px;
    background-color: #EFEFEF;
}
.tabela_interna tr {
    padding: 3px;
    background-color: #EFEFEF;
}
.tabela_interna td {
    padding-left: 2px;
    padding-right: 2px;
}
#tabela_interna td {
    padding-left: 2px;
    padding-right: 2px;
}
#tabela_interna tr.off {
    padding: 3px;
    background-color: #DCDEDD;
}
.tabela_interna tr.off {
    padding: 3px;
    background-color: #DCDEDD;
}
#tabela_interna TR.grupo1 {
    padding-right: 3px;
    padding-left: 3px;
    padding-bottom: 3px;
    padding-top: 3px;
    background-color: #EEEEEE;
}
#tabela_interna TR.grupo2 {
    padding-right: 3px;
    padding-left: 3px;
    padding-bottom: 3px;
    padding-top: 3px;
    background-color: #DCDEDD;
}
.td_label {
    background-color: #E4E4E4;
    font-size: 9px;
    color: #333333;
    margin: 0px;
    padding: 0px;
}
.td_dados {
    font-weight: bold;
    font-size: 9px;
    color: #333333;
    margin: 0px;
    padding: 0px;
}
#tabela_interna tr.link {
    padding: 3px;
    background-color: #FFFFFF;
    color: #CC0000
}
.tabela_interna tr.link {
    padding: 3px;
    background-color: #FFFFFF;
    color: #CC0000
}
.margem_botoes {
    margin: 5px;
}
button, .button {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: bold;
 ...

JavaScript

String.prototype.contains = function (sub) {
		return this.indexOf(sub) != -1;
	};

	$(".data").mask("99/99/9999").datepicker().attr("maxlength", 10);

	$.validator.addMethod("maximunDifferenceBetweenDates", function (value, element, param) {
		var startDate;
		var endDate;
		if (param[0].contains("Final")) {
			startDate = value;
			endDate = $(param[0]).val();
		} else {
			startDate = $(param[0]).val();
			endDate = value;
		}

		return areBothDatesFilled(startDate, endDate) ? (($.datepicker.parseDate("dd/mm/yy", endDate) - $.datepicker.parseDate("dd/mm/yy", startDate)) / 86400000) <= param[1] : true;
	}, $.validator.format("Por favor, forneça uma diferen&ccedil;a de no m&aacute;ximo {1} dias entre as datas."));

	function areBothDatesFilled(firstDate, secondDate) {
		return !isDateEmptyOrFilledWithMask(firstDate) && !isDateEmptyOrFilledWithMask(secondDate);
	}

	function isDateEmptyOrFilledWithMask(date) {
		return date == "" || date == "__/__/____";
	}

	$("form").validate({
		rules: {
			"filtro.codigoProcedimento": {
				range: [1, 9223372036854775807]
			},
				"filtro.codigoHospital": {
				range: [1, 9223372036854775807]
			},
				"filtro.codigoSegurado": {
				range: [1, 9223372036854775807]
			},
				"filtro.numeroSolicitacao": {
				range: [1, 2147483647]
			},
				"filtro.dataInicialSolicitacao": {
				skip_or_fill_minimum: [2, ".skipOrFillDatasSolicitacao"],
				require_from_group: [2, ".atLeastOneRequired"],
				maximunDifferenceBetweenDates: ["#dataFinalSolicitacao", 90]
			},
				"filtro.dataFinalSolicitacao": {
				skip_or_fill_minimum: [2, ".skipOrFillDatasSolicitacao"],
				require_from_group: [2, ".atLeastOneRequired"],
				maximunDifferenceBetweenDates: ["#dataInicialSolicitacao", 90]
			},
				"filtro.dataInicialInternacao": {
				skip_or_fill_minimum: [2, ".skipOrFillDatasInternacao"],
				require_from_group: [2, ".atLeastOneRequired"],
				maximunDifferenceBetweenDates: ["#dataFinalInternacao", 90]
			},
				"filtro.dataFinalInternacao":...