JSFiddle - React, Tailwind, and code Playground

HTML

<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 spillere er proven</br>
      </span></p>
            <b><p class="text-box">Som Innocent</p></b>
        <p class="text-box">
   <span class="co">Skadet
            <br>Drepe en innocent</br>
            <br>Eller drepe en detective</br>
            </span></p>
            
            <b><p class="text-box">Hvordan bli proven</p></b>
        <p class="text-box">
   <span class="co">Bli skutt av...

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

$(function() {
    $(window).on('resize', function() {
        $('.wrapper').css('margin-top', function() {
             return ($(document).height() - $(this).height()) / 4;
        });
    }).trigger('resize');
});