JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="container">
	<div class="col-md-12 col-sm-12 col-xs-12">
		<div class="col-md-6 col-sm-6 col-xs-6">
			<div class="error-number">404</div>
		</div>
		<div class="col-md-6 col-sm-6 col-xs-6">

			<div class="error-small-title">ERROR 404!</div>
			<div class="error-big-title">Oooops, an error has occured!</div>
			<div class="error-description">We are sorry but the page you are looking for is not available anymore or you have entered the wrong address.</div>
			<div class="col-md-5 col-sm-5 col-xs-5">
			<div class="row">
				<div class="error-button">
					<a href="#" class="error-small-title">RETURN TO HOMEPAGE</a>
				</div>
			</div>
			</div>
		</div>
	</div>
</div>

   	<footer>

		<div class="main-content">
			<div class="col-md-8 col-sm-8 col-xs-8 left-box">
				<div class="left-box-content">
				<div class="row">
				<div class="col-md-12 col-xs-12">

				<div class="col-md-2 col-sm-2 col-xs-2">
				<div class="row">
				<div class="r-logo">
					<img src="img/R-logo.png" class="img-responsive" />
				</div>
				</div>
				</div>
				
				<div class="col-md-10 col-xs-10">
				<nav class="link">
					<ul>
						<li><a href="#">Početna</a></li>
						<li><a href="#">Revicon</a></li>
						<li><a href="#">Konzalting</a></li>
						<li><a href="#">Seminari i savjetovanja</a></li>
						<li><a href="#">Časopisi</a></li>
						<li><a href="#">Izdavaštvo</a></li>
						<li><a href="#">Shop</a></li>
						<li><a href="#">Kontakt</a></li>
					</ul>
				</nav>
				</div>
				
				</div>
				</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-4 col-xs-4 right-box">
			<div class="col-md-12 col-xs-12">
				<div class="copyright">
					<span>Copyright &copy; 2000-2016 Revicon d.o.o. Sarajevo. Sva prava zadržana.</span>
				</div>
			</div>
			</div>
		</div>
	</footer>

CSS

@font-face {
	font-family:'PT_Sans_Caption_Bold';
	src: url('../fonts/PT_Sans_Caption_Bold.ttf');
	src: url('../fonts/PT_Sans_Caption_Bold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'fontawesome-webfont';
	src: url('../fonts/fontawesome-webfont.ttf');
	src: url('../fonts/fontawesome-webfont.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'fontawesome-webfont';
	src: url('../fonts/fontawesome-webfont.woff');
	src: url('../fonts/fontawesome-webfont.woff') format('webopenfont');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'fontawesome-webfont';
	src: url('../fonts/fontawesome-webfont.woff2');
	src: url('../fonts/fontawesome-webfont.woff2') format('woof2');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'PT_Serif_Bold';
	src: url('../fonts/PT_Serif_Bold.ttf');
	src: url('../fonts/PT_Serif_Bold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'PT_Sans_Regular';
	src: url('../fonts/PT_Sans_Regular.ttf');
	src: url('../fonts/PT_Sans_Regular.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'NotoSerif-Regular';
	src: url('../fonts/NotoSerif-Regular.ttf');
	src: url('../fonts/NotoSerif-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
}
@font-face {
	font-family:'NotoSerif-Bold';
	src: url('../fonts/NotoSerif-Bold');
	src: url('../fonts/NotoSerif-Bold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
}
body{
	background:#C20C0C;
}

.wrapper{
	max-width: 1600px;
	margin:0 auto;
}
.nav-wrapper{
	float: left;
	width: 100%;
	background-color: #fff;
}
.nav-wrapp{
	float: left;
	border-top:3px solid #C20C0C;
	border-bottom:...