JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<style>
@media print {
   div#top,
   div.nav,
   div#footer { display: none; }
 }
 </style>

<div id="wrapper">
    	<!-- Header -->
        <div id="top">
        <div id="logo">
        <img src="img/symbol.jpg" alt="Chinesisches Baum Symbol" />
        </div>
		<div id="title"><span><h1>Praxis für Traditionelle Chinesische Medizin</h1></span>
		</div>
        </div>
		
        <!-- Navigation -->
        <div  class="nav">
        	<br />
			<ul>
				<li class="current"><a href="#">Home</a></li>
				<li><a href="uebermich.html">&Uuml;ber Mich</a></li>
				<li><a href="angebot.html">Angebot</a></li>
				<li><a href="tarife.html">Tarife</a></li>
                <li><a href="krankenkasse.html">Krankenkasse</a></li>
				<li><a href="kontakt.html">Kontakt</a></li>	
			</ul>
		</div>

        <!-- Content -->
        <div  id="content">
        <div id="main">
        <h2>Meine Philosophie</h2>
		<p>
        Mein Ziel ist es, mit Hilfe der Chinesischen Medizin K&ouml;rper, Geist und Seele ins Gleichgewicht zu bringen, denn das Leben ist ein stetiger Balanceakt zwischen Yin und Yang – zwischen Wasser und Feuer. Bei Krankheit entsteht ein Ungleichgewicht dieser zwei Kr&auml;fte; sind wir gesund, leben wir in Harmonie.  Mir ist es wichtig, gemeinsam mit meinen Patientinnen und Patienten einen Weg zu finden, der es erm&ouml;glicht, zu dieser Ausgeglichenheit zur&uuml;ck zu finden, und vor allem zu lernen, wie man selbst die Balance aufrecht erhalten kann, denn Pr&auml;vention und eine gesunde Lebensf&uuml;hrung gehren meiner Meinung nach zu einem ganz wichtigen Gebiet der Chinesischen Medizin.
        </p>
        
        	<span class="chinese"><h5><i>"Trage immer einen grünen Zweig im Herzen,<br />es wird sich ein Singvogel darauf niederlassen."</i></h5>
        	<h5>Chinesische Weisheit</h5>
            </span>
        </div>
        </div>
        
        <!-- Footer -->
        <div  id="footer">
        <h6>&copy; 2013</h6>
        </div>

   ...

CSS

html,body
{
	height: 99%;
	width: 99%;
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	}

body {
background-color: #ce1d20; /*Default bg, similar to the background's base color*/
}

span { display:inline-block;}

#wrapper {
    width:90%;
    margin:20px auto;
	border-bottom: 1px dotted black;
}

#top {
	display: block;
	height: 160px;
	vertical-align: middle;
	min-width: inherit;
	border-bottom: 1px dotted black;
	background-color: #f3e8d6;
}

#logo {
	float: left;
	width: 200px;
	height: 150px;	
}

#title {
	height: 160px;
	vertical-align:middle;
}


.nav {
    float:left;
    width:200px;
	min-height: 100%;
	background-image: url(img/blank.gif);
    background-repeat: repeat-y;
}

.current {
	font-weight:800;
}

#content {
    width: 100%;
	min-height: 570px;
	text-align: left;
	padding-top: 10px;
	background-color: #f3e8d6; /*Default bg, similar to the background's base color*/
	background-image: url("../img/tree.jpg");
	background-position: right bottom; /*Positioning*/
	background-repeat: no-repeat; /*Prevent showing multiple background images*/
}

#main {
    width: 700px;
	height: inherit;
	text-align: left;
	padding-right: 400px;
}

#footer {
    clear:both;
	border-top: 1px dotted black;
	background-color: #f3e8d6;
}


li {
	list-style: none;
	list-style-position: inside;
	text-align:left;
	margin-top: 20px;
}

li.title {
	margin-top: 0px;
}

h1
{
font-size: 30px;
color: #42270c;
}

h2
{
font-size: 24px;
color: #42270c;
}

h3 { 
font-size: 18px;
font-style:italic;
color: #42270c;
}

h4 {
display:inline;
font-size:16px;
}

.chinese {
padding-top: 100px;
font-size: 20px;
color:  #42270c;
}


h6 { 
margin: 0;
padding: 0;
font-size: 12px;
}

a:link    {color: black; text-decoration: none;}
a:visited {color: black;  text-decoration: none;}
a:hover   {color: #ed2528; text-decoration: none;}
a:active  {color: black;  text-decoration: none;}