DELTA-002 (FF REMASTERED)

<style type="text/css">
.pfor {display: none;}
body {background-image:url("http://i.picpar.com/1x2c.jpg"); background-attachment:fixed;}

body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), progress !important;}


::-webkit-scrollbar {width: 3px;
        background-color: #f4a8a8; }
::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 3px #f4a8a8;
        background-color: #f5d4de; }
::-webkit-scrollbar-thumb { background-color: #fff;background-image: url("");
        border: 3px double #f4a8a8; }

 .clickable {
border:10px solid #990000;
background-color: #111;
padding:3px;
text-transform: uppercase;
color:#fff;
text-shadow: 1px 2px 1px #dfa4a4;
letter-spacing: 1px; font-size: 10px;  font-family: orator std;
}



a.linko {
    display:block;
    background:#fafafa;
    font: 9px courier new;
    margin-top:2px;
    padding-left:2px;
    border:1px solid transparent;
    text-transform:uppercase;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
a.linko:hover {font-style:italic;background:#fbadad;color:#424242;}

.nav01 {padding:0px 5px;}
#nav01{padding:0px 5px;}
#nav01:hover img.vvv {background:#fbadad;}
.nav01:hover img.vvv {background:#fbadad;}
img.vvv {padding:2px;
	border:1px solid #fbadad;
	background:#fff;
	margin-bottom:5px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;}



     .submaintitle { font-family: mistral; font-size: 15px; color: #e56464;
 padding: 2px 0px 1px 0px; background-color: #f1e2f1;
 text-align: right; }

.maintitle {
background-color: #e56464;  text-align: center;
   -webkit-text-stroke: 1px  #ddd;
text-transform: lowercase;
font-family: orator std; font-size: 10px; color: #e3ff48;

}




 ::selection {
  background: #990000;
}

.left {
  float: left;
  margin-right: 1em;
}

.right {
  float: right;
  margin-left: 2em;
}

figure {
  text-align: center;
  padding: .1em;
  margin: 0;
}

.musicplayer{
bottom: 2px;
left: 0px;
height: 20px;
width: 20px;
line-height: 20px;
font-size: 20px;
color: #fff;
text-align: right;
border-radius: 360px;
}

.musicplayer:active {
color: #ff0000;
}

.music{

margin-top: -30px;
margin-left: -2px;
height: 20px;
width: 20px;
overflow: hidden;
opacity: 0;
}

</style>

<DIV style="position: fixed; top:100px; left:330px;height:25px">
<a title="biography" class="nav01" href="#001">
<img class="vvv" src="http://i.picpar.com/Dx2c.png">
</a>

<br><a title="skills" class="nav01" href="#002">
<img class="vvv" src="http://i.picpar.com/Dx2c.png">
</a>
<br><a title="extra" class="nav01" href="#003">
<img class="vvv" src="http://i.picpar.com/Dx2c.png">
</a>
<br>
</td></tr>
<table>
</div>
</div>
</div>


<DIV style="position: fixed; top:100px; left:180px;height:25px">
<img style="border:1px solid #fbadad;" src="https://68.media.tumblr.com/tumblr_mcbhn12e3B1rjzu6no1_500.png" width="150"height="86">
</div>



<DIV style="position: fixed; top:100px; left:380px;">

<div style="background-color: #e56464;  font-size: 10px; width: 200px;height:24px;padding:2px; border: 1px solid #ff0000;">
<div class="maintitle">stats can go below</div>
</div>
</DIV>


<DIV style="position: fixed; top:132px; left:380px;">
 <div style="background-color: #transparent;  font-size: 10px; width: 200px;height:24px;padding:2px; border: 1px solid #e56464;">
wording</div></DIV>


<DIV style="position: fixed; top:163px; left:380px;">
 <div style="background-color: #transparent;  font-size: 10px; width: 200px;height:24px;padding:2px; border: 1px solid #e56464;">
wording2</div></DIV>


<DIV style="position: fixed; top:194px; left:380px;">
 <div style="background-color: #transparent;  font-size: 10px; width: 200px;height:24px;padding:2px; border: 1px solid #e56464;">
wording3</div></DIV>


<DIV style="position: fixed; top:225px; left:380px;">
 <div style="background-image: url(http://data.whicdn.com/images/28955250/large.gif);  font-size: 10px; width: 200px;height:24px;padding:2px; border: 1px solid #e56464;">


</DIV>



<DIV style="position: fixed; top:256px; left:380px;">
 <div style="background-color: #transparent;  font-size: 10px; width: 200px;height:42px;padding:2px; border: 1px solid #e56464;">

Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.</div></DIV>


<DIV style="position: Fixed; top:190px; left:124px;">

<div style=" background-color: #f1e2f1;  font-size: 9px; width: 200px;height:120px;padding:3px; border: 1px solid #f1e2f1;">
<div align="right">
<div class="submaintitle">ファンタジー

</div>

<font face="consolas"color="#c59fc5">
<div style="width:100%; height:90px; overflow:auto;">
I.Profile is the  work of <a href="http://dabblet.com/user/DeckerDie">Decker.Die</a> .
II.Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi.<br>
III.Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi..<br>
IV.Something about there being a <font color="#ff0000">void.</font><br>


</br>
<center>

</br>


</br>
</div>
</font></td>
</div>
</tr>
</table>
</div>
</DIV>


<DIV style="position: fixed; top:290px; left:130px;">

<div style="height: 325px; overflow-y: hidden;">

<a name="001"></a>

<div style="width:215px;height:315px;background:#fff;font-size: 10px; padding:2px; border: 3px solid #f5d4de;">

<div class="maintitle">title 1 </div><br>
<div style="width:100%; height:290px; overflow:auto;">

<font face="arial narrow"color="#c59fc5">
testing all can go here. change font, size and color accordingly.


</font>
</div>
</div>

<div style="height: 325px; overflow-y: hidden;">

<a name="002"></a>

<div style="width:215px;height:315px;background:#fff;font-size: 10px; padding:2px; border: 3px solid #f5d4de;">

<div class="maintitle">title 2 </div><br>
<div style="width:100%; height:290px; overflow:auto;">

<font face="arial narrow"color="#c59fc5">

<figure class="l left"><img style="border:1px solid #fbadad;" src="http://25.media.tumblr.com/f89c818eb8168361ddc32eb6f4e5ecfa/tumblr_mvpchqtRBB1r2k080o3_500.gif" width="150"height="86">

  </figure>
<br>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.<br>

<br>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.<br>

<br>Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.<br>

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.<br>

<br>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.<br>

<br>Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.<br>

</font>
</div>
</div>

<div style="height: 325px; overflow-y: hidden;">

<a name="003"></a>

<div style="width:215px;height:315px;background:#fff;font-size: 10px; padding:2px; border: 3px solid #f5d4de;">

<div class="maintitle">Title 3</div><br>
<div style="width:100%; height:290px; overflow:auto;">
<font face="arial narrow"color="#c59fc5">

<center>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.<br>

<br>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus.<br>

<br>Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.<br>

</div>


</font>
</div>
</div>