JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ng13-body">
		<nav class="navbar navbar-inverse navbar-static-top">					
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".bs-navbar-collapse">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="#">NerdyGamer13</a>
			</div>
			<div id="navbar" class="collapse navbar-collapse bs-navbar-collapse">
				<form class="navbar-form navbar-right">
					<div class="form-group">
						<input type="text" placeholder="Username" class="form-control" id="username">
					</div>
					<div class="form-group">
						<input type="password" placeholder="Password" class="form-control" id="password">
					</div>
					<button type="submit" class="btn btn-success" onclick="validate()">Login</button>
				</form>
			</div><!-- /.navbar-collapse -->					
		</nav>			
		<div class="ng13-welcome">
			<h1>Welcome to the Community</h1>
			<div id="ng13-welcome">
				<img src="images/NerdyGamer Logo.jpg" width="100%" alt="NerdyGamer">
			</div>	
			<h1>Please Login</h1>	
		</div>
		<hr>
		<footer>
			<div class="ng13-footer">
				<p style="margin: 0;">© 2015 NerdyGamer13 </p>
				<a href="#register" data-toggle="modal" style="color: #00DE00">Register</a>	
			</div>
		</footer>		
	</div>	
	
	<div class = "modal fade" id="register" role="dialog">
		<div class = "modal-dialog">
			<div class = "modal-content" style="background: linear-gradient(blue, rgba(0, 3, 36, 0.68)); padding: 10px">
				<div class = "modal-header">
					<h1 style="text-align: center; color: #00DE00">Welcome to the community</h1>
				</div>
				<div class="modal-body">
					<form class="register" name="register">
						<div class="form-group col-md-6">
							<input type="text" placeholder="First Name" class="form-control" id="firstName">
						</div>
						<div class="form-group...