Untitled

	<link rel="stylesheet" href="/styles/bootstrap-combined.min2.css">
<style type="text/css">
	        body {
            margin: 0;

}
	#topbar{
position: fixed;
left: 4px;
right: 4px;
top: -4px;
overflow: hidden;
background-color: #3a3631;
height: 35px;
border: 2px #4f4b45 solid;
border-radius:5px;
}

.topbarfixed{
position: absolute;
left: 0px;
right: 0px;
top: -4px;
overflow: hidden;
background-color: #5A534F;
height: 35px;
border-bottom: 2px #7A7573 solid;
font-size:14px;
color:white;
font-family:Geneva, sans-serif;
}

#topnavi {
line-height:33px;
width:100%
}

#topnavi ul {
margin:0 179px 0 2px;
}

#topnavi ul li {
float:left;
font-weight:bold;
font-size:16px;
height:35px;
padding-top:5px;
padding-right: 0.8em;
margin-right: 0.8em;
border-right: 1px solid #726A64;
}

#topnavi ul li a {
color: white;
text-decoration: none;
}

#topnavi ul li a:hover {
color: white;
text-decoration: underline;
}
html, #client {
	height: 96%;
	text-align: left;
	background-color: #000;
}

#client {
	position: fixed;
	overflow: hidden;
	left: 0;
	top: 35;
	right: 0;
	bottom: 0;
}
	</style>


<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
function UpdateStats()
{
        var health = 101;
        $.ajax({ type: "GET", url: "{url}/yo", cache: false }).done(function( newhealth )
        {
                if(health != newhealth)
                {
                        health = newhealth;
                        $("#hbar").css({width: newhealth + "%"}).animate({ width: newhealth + "%" }, 1000 );
						$("#hbar").html(newhealth);
                }
        });

		var energy = 101;
        $.ajax({ type: "GET", url: "{url}/yo2", cache: false }).done(function( newenergy )
        {
                if(energy != newenergy)
                {
                        energy = newenergy;
                        $("#ebar").css({width: newenergy + "%"}).animate({ width: newenergy + "%" }, 1000 );
						$("#ebar").html(newenergy);
                }
        });
}
setInterval( "UpdateStats()", 100);

</script>

<div id="topbar">
<div id="stats">
<div style="padding:4px;">
<div id="bars" style="width:100%;font-size:14px;color:white;font-family:verdana"></div>
</div>
</div>
</div>
<style type="text/css">
* { margin: 0; padding: 0; }
html, #client { height: 94.9%; text-align: left; }
#client { position: absolute; overflow: hidden; left: 0; top: 35; right: 0; bottom: 0; }

</style>

<body>
	 <div id="client" style="vertical-align:bottom;"></div>
 <div id="topbar">
<div style="padding:7px;">
<div class="progress progress-danger" style="width:49.5%;float:left;background-color:#3a3631;">
				<div id="hbar" class="bar">
				</div>
				</div>
				<div class="progress progress-info" style="width:49.5%;float:right;background-color:#3a3631;">
				<div id="ebar" class="bar">
				</div>
				</div>
</div>
</div>

    </body>