Jareth

<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Caveat);
@import url(https://fonts.googleapis.com/css?family=Farsan);
@import url(https://fonts.googleapis.com/css?family=Indie+Flower);
@import url(https://fonts.googleapis.com/css?family=Allura);
@import url(https://fonts.googleapis.com/css?family=Just+Another+Hand);

::-webkit-scrollbar { width: 2px; }
::-webkit-scrollbar-track { border-radius: 2px; background-color: transparent; }
::-webkit-scrollbar-thumb { border-radius: 2px; background-color: #transparent; }

body {
background-image: url("http://i.imgur.com/7xNFNSs.jpg");
background-repeat: no-repeat;
background-color: #000;
background-size: 100% 100%;
background-position: bottom right;
margin: 0;
overflow:hidden;}

@font-face{
 src:url(https://dl.dropboxusercontent.com/s/h9xzgchi6tkk51r/BrotherTattoo_Demo.ttf);
 font-family:'BrotherTattoo';}
@font-face{
 src:url(https://dl.dropboxusercontent.com/s/zv56q4hc434hyzr/LinaScriptDemo.ttf);
 font-family:'LinaScript';}
@font-face{
 src:url(https://dl.dropboxusercontent.com/s/2v42v7ln9m9kkr0/LinaScriptDotDemo.ttf);
 font-family:'LinaScriptDot';}
@font-face{
 src:url(https://dl.dropboxusercontent.com/s/bflxthh6b8z6r8t/RuthlessWreckinONE.ttf);
 font-family:'RuthlessWreckin';}
@font-face{
 src:url(https://dl.dropboxusercontent.com/s/yvzhla3ahr2tsgw/Vtc-NueTattooScript.otf);
 font-family:'NueTattooScript';}
@font-face{
 src:url(https://dl.dropboxusercontent.com/s/jvfoghfdjj5nnm8/writers_original.TTF);
 font-family:'writers';}


.name{
 position: absolute;
 z-index:2;
 left: -2%;
 bottom: -31.5%;
 color: #410202;
 text-shadow: -0.2vw 0.2vw 0.2vw #000;
 font-family: LinaScriptDot;
 font-size: 6vw;
 letter-spacing: 0vw;
}

#frame {
 z-index: 3;
 background: url();
 background-size: ;
 background-position: bottom left;
 background-repeat: repeat;
 position: absolute;
box-shadow:0px 0px 20px #;
background-color:#000;
border-top: 20px solid #fff;
border-left: 20px solid #fff;
border-right: 20px solid #fff;
border-bottom: 120px solid #fff;
 top: 4%;
 left: 28%;
 height: 75%;
 width: 40%;
opacity: 1;
}

#tab1{position:absolute;left:53%;bottom:-14%;z-index:99;}
#tab1 a{font-family:BrotherTattoo;font-size:3vw;color:#152B16;text-decoration:none; text-shadow: -0.2vw 0.2vw 0.2vw #000;}
#tab1 a:hover{font-family:BrotherTattoo;font-size:3vw;color:#000;text-decoration:none; text-shadow: -0.2vw 0.2vw 0.2vw #152B16;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;-o-transition: all 1s ease-out;transition: all 1s ease-out;}
#tab2{position:absolute;left:59%;bottom:-21%;z-index:99;}
#tab2 a{font-family:BrotherTattoo;font-size:3vw;color:#49183D;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #000;}
#tab2 a:hover{font-family:BrotherTattoo;font-size:3vw;color:#000;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #49183D;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;-o-transition: all 1s ease-out;transition: all 1s ease-out;}
#tab3{position:absolute;left:68%;bottom:-14%;z-index:99;}
#tab3 a{font-family:BrotherTattoo;font-size:3vw;color:#27244B;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #000;}
#tab3 a:hover{font-family:BrotherTattoo;font-size:3vw;color:#000;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #27244B;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;-o-transition: all 1s ease-out;transition: all 1s ease-out;}
#tab4{position:absolute;left:72%;bottom:-22%;z-index:99;}
#tab4 a{font-family:BrotherTattoo;font-size:3vw;color:#474922;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #000;}
#tab4 a:hover{font-family:BrotherTattoo;font-size:3vw;color:#000;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #474922;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;-o-transition: all 1s ease-out;transition: all 1s ease-out;}
#tab5{position:absolute;left:87%;bottom:-18%;z-index:99;}
#tab5 a{font-family:BrotherTattoo;font-size:3vw;color:#AE6900;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #000;}
#tab5 a:hover{font-family:BrotherTattoo;font-size:3vw;color:#000;text-decoration:none;text-shadow: -0.2vw 0.2vw 0.2vw #AE6900;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;-ms-transition: all 1s ease-out;-o-transition: all 1s ease-out;transition: all 1s ease-out;}

.jaz {
z-index: -1;
position: absolute;
background-color: #171616;
border: 3px solid #;
border-radius:0%;
box-shadow: -1vh 1vh 1vh #1D1C1E;
font-family: indie flower;
font-size: 15px;
padding: ;
color: #ddd;
height:70%;
top:10%;
left: 5%;
width: 40%;
line-height:19px;
overflow: auto;
opacity: 0;
padding:15px;
-webkit-transition: all 1s ease-out;
-moz-transition: all 1s ease-out;
-ms-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
.jaz:target {
z-index: 10;
opacity: 0.9;
position: absolute;
-webkit-transition: all 1s ease-out;
-moz-transition: all 1s ease-out;
-ms-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}

a {color: #897450; text-decoration: none; }
a:hover {color: pink; text-decoration: line-through;
cursor: url('http://media.tumblr.com/e7f72e808c4dbe5006b9c3a30dbc9b79/tumblr_inline_mh67vhwGnR1rdqsqf.png');}

h1{
color:#9B49E3;
font-size:21px;
line-height: 14px;
font-family:Caveat;
text-align: center;
letter-spacing:5px;
margin: 5px 5px 5px;
text-shadow: 1px 0px 0px #,
0px 1px 0px #,
-1px 0px 0px #,
0px -1px 0px #,
0px 0px 20px #;
}

b, strong {color: #D099FF; font-family: Caveat; font-size: 17px; font-style: normal; font-weight: bold; text-decoration: none; text-transform: ; font-style: italic; font-weight: normal;letter-spacing:1px;text-shadow: 0.0em 0 0 #;}



</style>
<div id="frame">
<a href="#1"><div id="tab1">Dossier</a></div>
<a href="#2"><div id="tab2">Story</a></div>
<a href="#3"><div id="tab3">Friends</a></div>
<a href="#4"><div id="tab4">OoC</a></div>
<a href="##"><div id="tab5">Reset</a></div>

<div id="1" class="jaz">
<h1>Dossier</h1>
<b>Given</b> <span style="float:right;">Jazzy Tone</span><br>
<b>Nicknames</b> <span style="float:right;">N/A</span><br>
<b>Age</b> <span style="float:right;">28</span><br>
<b>Gender</b> <span style="float:right;">Female</span><br>
<b>Hair Color</b> <span style="float:right;">Blonde</span><br>
<b>Eye Color</b> <span style="float:right;">Light Brown</span><br>
<b>Height</b> <span style="float:right;">5'4"</span><br>
<b>Weight</b> <span style="float:right;">135lbs</span> <br>
<b>Species</b> <span style="float:right;">Human</span><br>
<b>Physique</b> <span style="float:right;">Toned, Curvy</span><br>
<b>Orientation</b> <span style="float:right;">Mood Sexual</span><br>
<b>Status</b> <span style="float:right;">Singular</span><br>
<b>Occupation</b> <span style="float:right;">N/A</span><br>
</div>

<div id="2" class="jaz">
<h1>Backstory</h1>


</div>

<div id="3" class="jaz">
<h1>Friends</h1>
<center>
Is somewhat PM friendly.<br>
NO FUCKING STARTERS! I will ignore them and you.<br>
Room RP only. PMs are reserved.<br>
Don't be a dick.<br>
No means no.<br>
No drama.<br>
IC is not OOC.<br>
Don't ask for OOC info.<br>
Smut is mood based. So don't push or ignore button will be used.<br>
Post length is based on muse and partner. Will mostly mirror.<br>
No profile no rp.<br>
<br>
<b>Remember the golden rule. "Treat others as you want to be treated." Meaning you act like an asshole or bitch I will do the same.</b>

</center>
</div>

<div id="4" class="jaz">
<h1>OOC</h1>
<center>
Is somewhat PM friendly.<br>
NO FUCKING STARTERS! I will ignore them and you.<br>
Room RP only. PMs are reserved.<br>
Don't be a dick.<br>
No means no.<br>
No drama.<br>
IC is not OOC.<br>
Don't ask for OOC info.<br>
Smut is mood based. So don't push or ignore button will be used.<br>
Post length is based on muse and partner. Will mostly mirror.<br>
No profile no rp.<br>
<br>
<b>Remember the golden rule. "Treat others as you want to be treated." Meaning you act like an asshole or bitch I will do the same.</b>

</center>
</div>

<img src="http://i.imgur.com/qZJRNO9.png" width="96%" height="96%" style="position:absolute; bottom:1.8%; left: 2%;">
<img src="http://i.imgur.com/ABpWAPd.png" height="96.5%" style="position:absolute; bottom:1.9%; right: 1.9%;">
<div class="name">
Jareth
</div>
</div>