JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html>
	<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<meta name="description" content="Forside" /> 
	<title>Hjortefjellet</title> 
	<link href="style.css" rel="stylesheet" type="text/css" /> 
	
    <script type="text/javascript" src="scripts/jquery.js"></script><!-- Link to jquery so we can center the content -->
    
	</head>
	
	<body>
    
    <div class="wrapper"><!-- Opens the wrapper so we can contain and center everything -->
    

    
   <img src="images/logo.png" width="702" height="87" alt="Logo" />
    	
      <nav>
        	<ul>
        <li><a href="index.html">HJEM</a></li>
        <li><a href="forum">FORUM</a></li>
        <li><a href="http://hjortefjellet.com/forum/showthread.php?tid=18">DONER</a></li>
        <li><a href="servere.html">SERVERE</a>
      <li><a href="faq.html">FAQ</a></li>
          <li><a style="margin-right: 0 !important;" href="kontakt.html">KONTAKT</a></li>
  </ul>
   	  </nav>
        
        <div class="clear"></div>
    	
      <div class="box-wrap">
      <div class="box-wrap sidebar-left">
	<h2>Servere</h2>
	<p class="text-box"></p>
</div>

<div class="box-wrap sidebar-right">
	<h2>Hva er RDM?</h2>
	<p>Tekst</p>
</div>
           	<h2>Velkommen til Hjortefjellet</h2>
            
            <p class="text-box"><!-- PAGE TEXT -->
            Denne serveren kjører en modifisert versjon av Trouble in Terrorist Town, les dette før du spiller</p>
            <p class="text-box">Severen har ikke bruk for administratorer eller moderatorer for å holde spillet rettferdig. I starten av hver runde er alle beskyttet mot RDM.</p>
            <p class="text-box">Du mister beskyttelsen ved å gjøre en av disse tingene</p>
            <b><p class="text-box">Som Traitor</p></b>
        <p class="text-box"
   <span class="co">Skyte med våpen
            <br>Prop kill</br>
            <br>Goomba stomp</br>
            <br>Dra ut et traitor våpen</br>
            <br>Eller hvis for mange...

CSS

@charset "utf-8";
/* CSS Document */
/* Created By CaptainMcMarcus */
/* Heavily customized by Sjokomelk */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,600);

html {
	height: 100%; -webkit-font-smoothing: antialiased; font-smoothing: antialiased;
}

/* Clearing some default browser settings */
* {border: 0px; margin: 0px; padding: 0px;}
a:active {outline:none;}
:focus {-moz-outline-style:none;}
.clear {clear:both;}

/* These parts can be easily changed to affect the design */
body {color: #FFF; font-family: "Open Sans", Arial, Helvetica, sans-serif;
	background: url('images/bg.jpg') no-repeat; background-size: 100% auto; background-size: cover; background-attachment: fixed;}

p {text-align: justify; font-size:16px;}
p a { text-decoration: underline; color: #ea5353; text-decoration: underline;}
p a:hover { text-decoration: none; color: #333;}

/* Core Wrapper which we vertically align */
.wrapper {width: 700px; height: auto; margin: 0 auto; position:relative;}

.box-wrap {
	width: 100%;
	height: auto;
	margin: 20px 0 0 0;
	-webkit-box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.2);
	box-shadow: 4px 4px 16px rgba(0, 0, 0, 0.2);
}

.box-wrap h2 {width: 100%; height: auto; padding: 15px 0; text-align: center; 
background: url('images/header-bg.png') repeat center top; background-color: RGBA(42,52,59,0.75);}

.box-wrap p {
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 18px;
	padding: 5px 30px;
	overflow: hidden;
	text-align: justify;
	width: 640px;
	height: auto;
	background: #ffffff;
	color: #717171;
}

.co {
	font-family: 'Consolas', 'monospace';
	padding: 2px;
	display: inline-block;
	background-color: rgb(64,64,64);
	color: white;
	font-size: 12px;
	border-radius: 2px;
}

.icon-box {width: 210px; height: 210px; background: #FFF; margin: 20px 15px 20px 0; float: left; text-decoration: none;}
.icon-box a {text-decoration: none;}
.icon-box p {font-family: 'Open Sans', Arial,...

JavaScript

/*! jQuery v1.8.3 jquery.com | jquery.org/license */
(function(e,t){function _(e){var t=M[e]={};return v.each(e.split(y),function(e,n){t[n]=!0}),t}function H(e,n,r){if(r===t&&e.nodeType===1){var i="data-"+n.replace(P,"-$1").toLowerCase();r=e.getAttribute(i);if(typeof r=="string"){try{r=r==="true"?!0:r==="false"?!1:r==="null"?null:+r+""===r?+r:D.test(r)?v.parseJSON(r):r}catch(s){}v.data(e,n,r)}else r=t}return r}function B(e){var t;for(t in e){if(t==="data"&&v.isEmptyObject(e[t]))continue;if(t!=="toJSON")return!1}return!0}function et(){return!1}function tt(){return!0}function ut(e){return!e||!e.parentNode||e.parentNode.nodeType===11}function at(e,t){do e=e[t];while(e&&e.nodeType!==1);return e}function ft(e,t,n){t=t||0;if(v.isFunction(t))return v.grep(e,function(e,r){var i=!!t.call(e,r,e);return i===n});if(t.nodeType)return v.grep(e,function(e,r){return e===t===n});if(typeof t=="string"){var r=v.grep(e,function(e){return e.nodeType===1});if(it.test(t))return v.filter(t,r,!n);t=v.filter(t,r)}return v.grep(e,function(e,r){return v.inArray(e,t)>=0===n})}function lt(e){var t=ct.split("|"),n=e.createDocumentFragment();if(n.createElement)while(t.length)n.createElement(t.pop());return n}function Lt(e,t){return e.getElementsByTagName(t)[0]||e.appendChild(e.ownerDocument.createElement(t))}function At(e,t){if(t.nodeType!==1||!v.hasData(e))return;var n,r,i,s=v._data(e),o=v._data(t,s),u=s.events;if(u){delete o.handle,o.events={};for(n in u)for(r=0,i=u[n].length;r<i;r++)v.event.add(t,n,u[n][r])}o.data&&(o.data=v.extend({},o.data))}function Ot(e,t){var...