JSFiddle - React, Tailwind, and code Playground

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <link type="text/css" rel="stylesheet" href="/MPCMS/javax.faces.resource/theme.css.jsf?ln=primefaces-aristo">
    <link type="text/css" rel="stylesheet" href="/MPCMS/javax.faces.resource/primefaces.css.jsf?ln=primefaces">
    <link type="text/css" rel="stylesheet" href="/MPCMS/javax.faces.resource/template.css.jsf?ln=css">
    <link type="text/css" rel="stylesheet" href="/MPCMS/javax.faces.resource/novoFuncionario.css.jsf?ln=css">
    <script type="text/javascript" src="/MPCMS/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces"></script>
    <script type="text/javascript" src="/MPCMS/javax.faces.resource/primefaces.js.jsf?ln=primefaces"></script>
    <title>
		Gerenciar Usuário
	 :: Ficha Funcional - MPC/MS</title>
    <script type="text/javascript">
		PrimeFaces.locales['pt'] = {
			closeText : 'Fechar',
			prevText : 'Anterior',
			nextText : 'Próximo',
			currentText : 'Começo',
			monthNames : [ 'Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio',
					'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro',
					'Novembro', 'Dezembro' ],
			monthNamesShort : [ 'Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun',
					'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez' ],
			dayNames : [ 'Domingo', 'Segunda', 'Terça', 'Quarta', 'Quinta',
					'Sexta', 'Sábado' ],
			dayNamesShort : [ 'Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb' ],
			dayNamesMin : [ 'D', 'S', 'T', 'Q', 'Q', 'S', 'S' ],
			weekHeader : 'Semana',
			firstDay : 0,
			isRTL : false,
			showMonthAfterYear : false,
			yearSuffix : '',
			timeOnlyTitle : 'Só Horas',
			timeText : 'Tempo',
			hourText : 'Hora',
			minuteText : 'Minuto',
			secondText : 'Segundo',
			ampm : false,
			month : 'Mês',
			week : 'Semana',
			day : 'Dia',
			allDayText : 'Todo o Dia'
		};
	</script>
    <script type="text/javascript">
	// Função única que fará a transação
	function getEndereco() {
    if($.trim($("#zipcode").val()) != ""){
       ...

CSS

@CHARSET "ISO-8859-1";

html {
	height: 100%;
}

body {
	padding: 0px;
	margin: 0px;
	height: 100%;
}

#header {
	background-image: url("/MPCMS/resources/images/backbodyfooter.png");
	background-repeat: repeat-x;
	height: 100px;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

#titulo {
	font-family: Garamond, serif;
	line-height: 1em;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 50px;
	text-shadow: 0px 0px 0 rgb(231, 231, 231), 1px 1px 0 rgb(216, 216, 216),
		2px 2px 0 rgb(202, 202, 202), 3px 3px 0 rgb(187, 187, 187), 4px 4px 0
		rgb(173, 173, 173), 5px 5px 0 rgb(158, 158, 158), 6px 6px 0
		rgb(144, 144, 144), 7px 7px 6px rgba(0, 0, 0, 0.6), 7px 7px 1px
		rgba(0, 0, 0, 0.5), 0px 0px 6px rgba(0, 0, 0, .2);
}

#content {
	height: auto !important;
	padding-top: 5px;
	padding-bottom: 0px;
	background-image: url("/MPCMS/resources/images/simbolo.gif");
	background-repeat: no-repeat;
	background-position: 50%;

}
	
#left {
	width: 200px;
	height: 460px;
	-webkit-border-radius: 0px 20px 20px 0px;
	-moz-border-radius: 0px 20px 20px 0px;
	border-radius: 0px 20px 20px 0px;
	border: 1px solid #CFCFCF;
	background-color: #FFFFFF;
	-webkit-box-shadow: #B3B3B3 7px 7px 7px;
	-moz-box-shadow: #B3B3B3 7px 7px 7px;
	box-shadow: #B3B3B3 7px 7px 7px;
	text-align: center;
	margin-bottom: 20px;
	margin-top: 20px;
	float: left;
}

#left_links {
	padding: 80% 0;
}

#central {
	width: 70%;
	height: 460px;
	margin: 20px auto;
	text-align: center;
}

#footer {
	cbackground-image: url("/MPCMS/resources/images/backbodyfooter.png");
	background-repeat: repeat-x;
	height: 70px;
	margin: 0px;
	position: absolute;
	bottom: 0;
	text-align: center;
	bottom: 0;
	width: 100%;
}

a:LINK {
	color: #000;
	text-decoration: none;
}

a:HOVER {
	text-decoration: underline;
}