phenom;

<style type="text/css">
	.pfor {
	display: none;
	}

@font-face {font-family:"Nova"; src:url('http://static.tumblr.com/9wzbixa/38Em26n60/novasolid_trial__.otf');}

@font-face {font-family:Caviar Dreams;src:url(http://static.tumblr.com/4yxykdm/xXTlrecqr/caviardreams.ttf); }


body {
background: url(http://oi60.tinypic.com/v80z6e.jpg);
background-attachment: fixed;
background-repeat: no repeat;
font-family: Courier;
font-size: 72%;
	}

#profile {
background-color: transparent;
border: none;
}

::-webkit-scrollbar-thumb:vertical {
background-color: #000000;
}

::-webkit-scrollbar {
height: 5px;
width: 5px;
background-color:#A9A9A9;
}

a{
cursor:help;
color:#000;
font-size: 100%;
text-decoration:none;
}

a:hover{
color:#D0C1CF;
}

b{
color:#000;
font-weight:700;
}

h1 {
font-size:13pt;
color: #ffffff;
border-bottom: 1px solid 000000;
font-family: caviar dreams;
letter-spacing: 2px;
margin-top:0px;
margin-bottom: 0px;
padding:5px 5px 5px 5px;
text-align: center;
}

#nav {
background-color: #transparent;
height: 150px;
width: 30px;
position: absolute;
top: 125px;
left: 575px;
}

a.navi:link, a.navi:active, a.navi:visited{
height:10px;
width:10px;
display:block;
padding:2px;
-moz-border-radius:50px;
border-radius:12px;
border: 2px solid #fff;
background-color:#000000;
transition:all 0.8s ease-out;
-o-transition:all 0.8s ease-in-out;
-moz-transition:all 0.8s ease-in-out;
-webkit-transition:all 0.8s ease-in-out;
}

a.navi:hover {
border-color: #000;
background-color:#FFF;
}

.content {
color: #000000;
text-align: left;
overflow-y:auto;
padding:7px;
background-color:A9A9A9;
line-height: 20px;
border: 2px solid 000000;
position: fixed;
height: 200px;
width: 450px;
right: 470px;
top: 225px;
-webkit-border-bottom-left-radius: 20px;
opacity: 0;
transition: all 1s ease-in-out;
-webkit-transition: all 0.6s ease-in-out;
-moz-transition: all 0.6s ease-in-out;
-o-transition: all 0.6s ease-in-out;
-ms-transition: all 0.6s ease-in-out;
z-index:-1
}

.content:target {
position: fixed;
right: 470px;
top: 225px;
opacity: 1;
transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
z-index:999;
}

.text {
position:absolute;
top:275px;
left:-120px;
font-family: nova;
color:#000000;
font-size:95px;
-webkit-transform:rotate(-90deg);
}

</style>

<div id="nav">
<a href="#01" class="navi"></a><br>
<a href="#02" class="navi"></a><br>
<a href="#03" class="navi"></a>
</div>


<div id="01" class="content">
<h1>statistics</h1>
alias :: Phineas.<br>
full name :: unknown.<br>
d.o.b :: 05 october, 1988.<br>
age :: twenty six.<br>
species :: unknown.<br>
status :: <a href="http://1.roleplaychat.org/profile.php?user=Damius">enamored.</a><br>
nationality :: german.<br>
height :: 163cm, 5'4<br>
weight :: 51kg, 112lbs<br>
eyes :: yellow; vertical pupils. <br>
hair :: coral, both sides cleanly shaven, the hair on top is decent length and occasionally either tied or slicked back.<br>
</div>

<div id="02" class="content">
<h1>persona & appearance</h1>
Phineas is an aloof, quiet, and quite apathetic man. His expression will either be blank, or stone hard -- almost as if he's irritated, though as nothing inparticular. Even during conversation he probably didn't want to engage into in the first place, he'll be uninterested, or appear to be. It's sometimes impossible to tell from other point of views. Phineas will even go for minutes at a time without blinking, his stare able to unnerve anyone and make any situation awkward and uncomfortable. He's even been labeled as a mute a time or two in the past. Talking isn't something he enjoys doing ; at least not to people he isn't close with. It takes persistence to get through his own stubborn exterior. It's rare he'll ever approach someone. The times he does, is one of the times his interest is piqued just enough, and although it's not too difficult to make him notice something, it's rare to make him show it. Despite his antisocial behavior, his nerves are easy to tug on. Things will often be taken seriously, and his temper will be lost. Due to past experiences, he's also prone to violent outbursts in response to certain situations; e.g, being taken by surprise, sudden physical contact. Sometimes, more than occasionally, he'll rub at his nose -- it might be out of nervousness or anxiety, but he'll do so and at times won't stop until someone points it out. <br>
<i><a title="fear of cotton balls">sidonglobophobia</a>, <a title="fear of heights">acrophobia</a>, <a title="fear of puppets">pupaphobia</a></i>. → nocturnal epilepsy, dyscalculia.<br>
Freckles are scattered about his cheeks and over the bridge of his disfigured nose. He has a mouth full of sharp, pearly whites. Ears also have pointed tips, the lobes stretched to and occupied by 00g plugs. Scars vary: a nasty scar runs up from the left side of his upper lip, approx. one inch in length, a few more minor scars scattered about his arms that have been covered with tattoos, and finally a long one that runs diagonally across his whole back. A small scar interferes with the freckles across his nose, and he'll sometimes cover it with a band-aid. Also has a labret piercing, though since it bothers him, he often leaves it empty. Whenever he decides to put something through it, it's usually a simple, silver metal hoop. A bracelet is worn around his right wrist, a small deer embedded into the material, and it was a gift given to him that  he does not plan on taking off. Inked patterns along his arms, as well as a combination of numbers along his chest are covered by an olive green, old knit sweater. If the weather is warmer than he's used to, he'll ditch the sweater and wear a hooded black vest, arms exposed, although his head will be covered. This is his usual attire, normally seen with a worn out pair of brown combat boots or slip-on Vans -- pants vary from cargo, to jeans, to sweats.
</div></div>

<div id="03" class="content">
<h1>history</h1>
It was a story that was the headliners in Germany, in every paper all over the country, in every city -- in every magazine. It was a story that made people want to publish their own local little newspaper so they could write about it more than it already had been.
Of course, though, Germany hadn't been very eventful in recent months. The news grew repetitive, boring.<br>
Which made this even more interesting. Even if the country was lively, the finding wouldn't have been overlooked.<br>
1996, an eight year old <span style="color: #000000; font-family: 'Garamond'; font-size:medium;">p h e n o m e n o n</span> had been found. Ripped from his family, mother fleeing since she too had carried the same traits the child had. However, they only wanted the kid. He was younger. Had a much longer time to live. Which meant more years in experimenting; their little <span style="color: #000000; font-family: 'Garamond'; font-size:medium;">lab rat</span>. Of course, those parts had been left out of all articles that were written. Along with countless other bits of the real story. But after all, it was <span style="color: #000000; font-family: 'Garamond'; font-size:medium;">confidential</span>.
</div>

<div style="position: fixed; top: 85px; left: 125px; background-color: transparent; overflow: auto;">
<a href="http://www.youtube.com/watch?v=N83eCpPua_A">000</a>
<a href="http://i.picpar.com/7rG.png"> 001</a><a href="http://i.picpar.com/8rG.jpg"> 002</a> <a href="http://i.picpar.com/5rG.jpg">003 </a><a href="http://i.picpar.com/4rG.jpg"> 004.</a></div></font>

<div style="position: fixed; bottom: 175px; left: 125px; background-color: transparent; overflow: auto; text-align:left;">
<font color="000000">Story over smut, always. Length flexible. Forever WIP.<br>I do have Skype. All art shown/linked is Creature13's work.</font></div></div>

<div style="position: fixed; top:100px; left: 125px;">
<img src="http://oi58.tinypic.com/2f07io4.jpg" height="225" width="452">
</div>
<div style="position: fixed; top:320px; left: 125px;">
<img src="http://oi60.tinypic.com/bg1s7a.jpg" height="225">
</div>

<div class="text">phenomenon</div>