JSFiddle - React, Tailwind, and code Playground

HTML

<body>
     	<div id="nav">
       		<ul>        
                <li><a href="#start">Start</a></li>
                <li><a href="#profil_content">Profil</a></li>
                <li><a href="#referencer">Referencer</a></li>
                <li><a href="#projekter">Projekter</a></li>
            </ul>
        </div>
     	<a id="start"></a>
    	<div id="wrapper">
            <img id="startbillede" src="img/Morten.jpg" />
            <div id="startinfo">
                <h1>Morten Christiansen</h1>
                <h2>Webintegrator & Webudvikler</h2>
                <hr />
                <p><span class="pcolor">Email: morten1691@gmail.com</span></p>
                <p><span class="pcolor">Steam: Kh4zy</span></p>
                <p><span class="pcolor">Facebook: Morten.Christiansen.359</span></p>
            </div>
            <div id="profil_content">
                <h3 class="h3_underline"">Profil</h3>
                    <hr class="greyhr"  />
                    <div id="profilinfo">
                        <p class="indhold_skrift2">Altid frisk & klar på webudvikling efter dine behov!</p>
                        <hr class="greyhr" />
                        <p class="indhold_skrift">Mit navn er Morten Christiansen. Jeg er 22 år & bosat i Nykøbing F. Jeg er igang med at uddanne mig som Web-Integrator på Roskilde Tekniske Skole CMK.
                        Jeg går på hovedforløbet og forventer at være færdig d. 19-12-2014.</p>
                        <p class="indhold_skrift">Jeg elsker og brænder for webprogrammering & udvikling!</p>
                    </div>
                	<ul id="skill">
                        <li><span class="bar html_css">100%</span><h3>HTML & CSS</h3></li>
                        <li><span class="bar php">20%</span><h3>PHP & MySQL(i)</h3></li>
                        <li><span class="bar grafisk_design">99%</span><h3>GRAFISK DESIGN</h3></li>
                        <li><span class="bar jquery">25%</span><h3>jQuery</h3></li>
       ...

CSS

/*RESET*/
*{
	margin:0px;
	padding:0px;
	border:0;
}

body{
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	background:#2b2b2b;
}

h1{
	text-transform:uppercase;
	font-size:29px;
	padding:0 0 6px 0;
}

#toph1{
	font-size:90px;
	color:#FFF;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
}

h2{
	text-transform:uppercase;
	font-size:18px;
	font-weight:normal;
}

.h3_underline{
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	text-transform:uppercase;
	font-size:14px;
	font-weight:normal;
	padding:0 0 3px 0;
	border-bottom:2px solid #669;
	display:table;
}

h4{
	background:#669;
	color:#fff;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	text-transform:uppercase;
	font-size:30px;
	padding:10px;
}

p{
	margin-bottom:15px;
}

.indhold_skrift{
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	margin-bottom:15px;
}

.indhold_skrift2{
	font-size:30pt;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	margin-bottom:15px;
}

#wrapper{
	width:763px;
	height:2000px;
	margin:0px auto;
}

#nav{
	width:100%;
	position:fixed;
	text-align:center;
	z-index:10;
	background:#669;
}

#nav ul{
	width:768px;
	margin:auto;
	position:relative;
}

#nav ul li{
	display:inline-block;
	list-style:none;
}

#nav ul li a{
	font-weight:bold;
	line-height:53px;
	padding:20px;
	text-decoration:none;
	text-transform:uppercase;
	color:rgba(255,255,255,1);
}

#nav ul li a:hover{
	background:#535398;
     -webkit-transition: background-color 400ms linear;
     -moz-transition: background-color 400ms linear;
     -o-transition: background-color 400ms linear;
     -ms-transition: background-color 400ms linear;
     transition: background-color 400ms linear;
}

#startbillede{
	height:194px;
	border:10px solid #fff;
	margin:102px 20px 0 0;
	float:left;
}

#startinfo{
	background:#fff;
	padding:10px;
	height:194px;
	float:right;
	margin:102px 0 0...

JavaScript

$(document).ready(function(){
	$('a[href^="#"]').on('click',function (e) {
	    e.preventDefault();

	    var target = this.hash,
	    $target = $(target);

	    $('html, body').stop().animate({
	        'scrollTop': $target.offset().top
	    }, 900, 'swing', function () {
	        window.location.hash = target;
	    });
	});
});