JSFiddle - React, Tailwind, and code Playground

by grafixguy76

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title>Work Life Balance</title>
	<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
	<meta content="Work, life, balance, training" name="keywords" />
	<meta content="This Work Life Balance training is the best benefit you can provide your employees." name="description" />
	<link href="assets/styles/masterstyles.css" rel="stylesheet" type="text/css" />

	<script language="JavaScript" type="text/jscript">
		<!--

			function MM_openBrWindow(theURL,winName,features) { //v2.0
			  window.open(theURL,winName,features);
			}


			function popWin(url, label, width, height, scroll,resize,status) {
				var Xcord = (window.screen.width-width)/2;
				var Ycord = (window.screen.height-height)/2;
				window.open(url, label, "width="+width+",height="+height+", top="+Ycord+", left="+Xcord+", toolbar=no, location=no, directories=no, status="+status+", menubar=no, scrollbars="+scroll+", resizable="+resize+"");
			}

		//-->
	</script>

</head>
<body background="assets/images/bg-2.gif" text="#000000">
	<table align="center" border="0" cellpadding="0" cellspacing="0" width="741">
		<tr>
			<td bgcolor="#006531">
				<table border="0" cellpadding="0" cellspacing="0" width="740">
					<tr>
						<td>
							<img alt="Welcome to Work life balance" border="0" height="57" src="assets/images/masthead.gif" usemap="#Map2" width="741" /></td>
					</tr>
				</table>
			</td>
			<td>&nbsp;</td>
		</tr>
		<tr>
			<td bgcolor="#2E7652">
				<table border="0" cellpadding="0" cellspacing="0" width="741">
					<tr>
						<td bgcolor="#2E7652">
							<a href="ceo.html">
								<img border="0" height="21" src="assets/images/teaser-ceo.gif" width="180"></a></td>
						<td width="180">
							<div align="right">
								<img alt="The leader in work life balance" border="0" height="21" src="assets/images/nav-home.gif" usemap="#Map"...

CSS

.narrative {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; color: #333333}
.footNote {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 6pt; color: #333333}
h1 {  font-family: Arial, Helvetica, sans-serif; font-size: 12pt; font-weight: bolder; color: #006531}
.footerReverse {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 7pt; color: #FFFFFF; line-height: 18px}
.footerReverse a {  text-decoration: underline; color: #FFFFFF}
.narrative a {  color: #0000FF; text-decoration: underline; font-weight: bold}
.footerReverse a:hover {  color: #FFFF00}
.footer { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 7pt; color: #006633; line-height: normal}
h2 { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bolder; color: #006531 }
.footerPhone {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14pt; color: #FFFFFF; line-height: 18px}
span.block_small {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8pt; color: #333333}
span.block_big{  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; color: #333333}
td.block{border:2px solid black;}