Mercer by Tojibutt

<style type="text/css">
@font-face{font-family:Basic L;src:url(http://static.tumblr.com/9wzbixa/Cf3mj2g0f/basicl.ttf);}

.pfor {display:none;}

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

body {
background-color:#ffffff;
background-image:url("http://i.picpar.com/Sy5.png");
background-attachment:fixed;
}

#reach{
position:absolute;
top:130px;
left:130px;
height:400px;
width:220px;
background: url('http://i.picpar.com/Xy5.png');
background-size: 120%;
background-position: 41% 15%;
border:3px double #999;
border-radius:13px;
box-shadow: 0px 5px 15px #ddd;
}

#for{
position:absolute;
top:180px;
left:400px;
height:30px;
width:380px;
background:#fff;
border-radius:25px;
border-top:1px solid #ddd;
border-bottom:2px solid #999;
box-shadow: 0px 5px 15px #ddd;
}

 .me{
position:absolute;
top:-8px;
left:-25px;
height:49px;
width:50px;
background:url('http://i.picpar.com/dz5.png');
}

 .dear{
position:absolute;
top:4px;
left:30px;
width:335px;
font-family:Basic L;
font-size:20px;
letter-spacing:-2px;
color:#333;
}

#the{
position:absolute;
top:270px;
left:414px;
width:330px;
height:6px;
background:#d0d0d0;
}

 .light{
position:absolute;
top:-27px;
height:60px;
width:380px;
}

#stars{
position:absolute;
top:330px;
left:380px;
width: 400px;
height: 170px;
background:#fefefe;
border-radius:25px;
border-top:2px solid #999;
border-bottom:2px solid #999;
box-shadow: 0px 5px 15px #ddd;
overflow:hidden;
}

#rise, #to, #thee, #heavens{
width: 400px; height:170px;overflow:auto;
}

 .embrace{
color:#555;
font-size: 10px;
text-align: justify;
font-family:cambria;
line-height:13px;
margin: 8px 16px 8px 16px;
}

a.night:link, a.night:active, a.night:visited{
height:36px;
width:60px;
display: block;
float: left;
margin-right: 31px;
-moz-border-radius:35px;
border-radius:35px;
font-family: consolas;
text-decoration: none;
font-size: 9px!important;
letter-spacing: 0px;
background-color: bbb;
color: #555;
padding-top: 24px;
text-align: center!important;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
}

a.night:hover{background-color:ddd;
text-decoration: none;}

a:active, a:link, a:visited{
color:#6b7b91;
text-decoration:none;
}

a:hover{
cursor:help;
color:#000;
text-decoration:line-through;
}

b {
color: #6993aa;
font-family:georgia;
font-weight:bold;
letter-spacing: 1px;
}

i{
color:#9dbfc6;
font-family:georgia;
font-weight:light;
letter-spacing: 1px;
font-style:italic;
}

u{
text-decoration:none;
border-bottom:1px dotted #6993aa;
}

::-webkit-scrollbar {width: 4px;}
::-webkit-scrollbar-thumb:vertical {
height: 10px;background-color: #dfdfdf;}
::-webkit-scrollbar-thumb:horizontal {
height: 10px;background-color: #dfdfdf;border: 0px ;width: 15px;}

</style>

<div id="reach"></div>

<div id="for">
<div class="me"></div>
<div class="dear">

Text plx

</div>
</div>

<div id="the">
<div class="light">

<a href="#rise" class="night">NAV</a>
<a href="#to" class="night">NAV</a>
<a href="#thee" class="night">NAV</a>
<a href="#heavens" class="night">NAV</a>
</div>
</div>

<div id="stars">
<div id="rise">
<div class="embrace">

<a href="">Link</a> <b>Bold</b> <i>Italics</i> <u>Underline</u> and Regular<br>

</div>
</div>
<div id="to">
<div class="embrace">

I

</div>
</div>
<div id="thee">
<div class="embrace">

Will

</div>
</div>
<div id="heavens">
<div class="embrace">

Cry

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