studmuffin

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Permanent Marker');

#profile-container {
 background: none;
}


body {
 background: #5E3929;
background-image: url('https://www.transparenttextures.com/patterns/billie-holiday.png');
}

body,
a:hover {
 cursor: url(http://i.imgur.com/cd7ZHDh.png), progress !important;
}

@font-face {
 font-family: name;
 src: url(https://dl.dropbox.com/s/n9024eacn77mx83/JLSDataGothicC_NC.otf?dl=0);
}

@font-face {
 font-family: text;
 src: url(https://dl.dropbox.com/s/frnhe54xgarw9c0/Jura-Light.ttf?dl=0);
}

#title{
 position:fixed;
 width: 700px;
 height:10px;
 top: 85px;
 left: 10px;
 font-family: 'Permanent Marker', cursive;
 font-size: 20px;
 color: #e0e2e4;
text-shadow: 1px 1px 1px #333;
opacity: 1;
z-index: 4;
 }

#title2{
 position:fixed;
 width: 700px;
 height:10px;
 top: 465px;
 left: 10px;
 font-family: 'Permanent Marker', cursive;
 font-size: 20px;
 color: #e0e2e4;
text-shadow: 1px 1px 1px #333;
opacity: 1;
z-index: 4;
 }

.pic {
 z-index: 1;
 position: absolute;
 border: 10px solid #96897f;
 background: url(https://i.imgur.com/X2jsdXj.gif) center;
 background-size: auto 180%;
 top: 125px;
 left: 35px;
 width: 280px;
 height: 140px;
opacity: .6;
z-index: 3;
}


.pic2 {
 z-index: 1;
 position: absolute;
 border: 10px solid #96897f;
 background: url(https://i.imgur.com/RGTFFpT.gif) center;
 background-size: auto 225%;
 top: 292px;
 left: 35px;
 width: 280px;
 height: 143px;
opacity: .5;
z-index: 3;


}
.navbar {Background-color: transparent; Position: absolute; left: 345px; top: 175px; padding: px; z-index: 1000; }

.link1 {Position: absolute; Top: 3px; Height: 25px; Width: 15px; background-color: #96897f; border-radius: 0%;}

.link2 {Position: absolute; Top: 40px; Left: px; Height: 25px; Width: 15px; background-color: #96897f; border-radius: 0%;}

.link3 {Position: absolute; Top: 80px; Left: px; Height: 25px; Width: 15px; background-color: #96897f; border-radius: 0%;}

.link4 {Position: absolute; Top:118px; Left: px; Height: 25px; Width: 15px; background-color: #96897f; border-radius: 0%;}

.slide {Position: fixed; Top: 0px; Left: 0; Z-index: -1; Opacity: -2; transition: 1s; -moz-transition: 1s; webkit-transition: 1s; -o-transition: 1s;}

.slide:target {Top: 0; Opacity: .7; Z-index: 1; transition: 1s; -moz-transition: 1s; webkit-transition: 1s; -o-transition: 1s;}

.textbox { background-color: #96897f; color: #fff; font-size: 12px; font-family: 'Shadows Into Light', cursive; text-align: justify; position: absolute; width:300; height:280; left: 400; top:140; letter-spacing: .3px; line-height: 12px; padding: 3px; margin: 1px; overflow:auto; border: 10px solid #c6bcb6; z-index: 3;}



.box {
 z-index: 1;
 position: absolute;
 border-top: 15px solid #96897f;
 border-left: 15px solid #96897f;
 border-bottom: 15px solid #96897f;
 width: 335px;
 height: 350px;
 left: 10px;
 top: 100px;
}

.bar1 {
 z-index: 1;
 position: absolute;
 border-right: 15px solid #96897f;
 width: 335px;
 height: 70px;
 left: 10px;
 top: 100px;
}

.bar2 {
 z-index: 1;
 position: absolute;
 border-right: 15px solid #96897f;
 width: 335px;
 height: 140px;
 left: 10px;
 top: 326px;
}





table,
th,
td {
 font-family: text;
 font-size: 13px;
 padding: 6px;
}

td:nth-child(odd) {
 color: #fff;
 text-align: left;
}

td:nth-child(even) {
 color: #e0e2e4;
 text-align: right;
}

hr {
 height: 3px;
 border: none;
 background: #625750;
 width: 300px;
}

a:link,
a:visited,
a:active {
 text-decoration: none;
 color: #5E3929;
 -webkit-transition: all .5s ease;
}

a:hover {
 color: #774F38;
 -webkit-transition: all .5s ease;
 cursor: url(https://i.imgur.com/SAa1psh.gif), progress !important;
}

::-webkit-scrollbar {
 width: 7px;
 height: 5px;
}

::-webkit-scrollbar-thumb {
 background: #9ab77d;
 border: 2px solid #2c6654;
}

::-webkit-scrollbar-track {
 background: #transparent;
}

.picy { width: 100px; height: 100px; opacity: 0.85; border: 3px solid #9ab77d; -webkit-transition:opacity 0.7s linear;
 -webkit-transition:all 0.9s ease-out;
 -moz-transition:all 0.9s ease-out;
 transition:all 0.9s ease-out;


</style>


<div class="pic">
 <p> </p>
</div>
<div class="pic2">
 <p> </p>
</div>
<div class="box">
 <p> </p>
</div>
<div class="bar1">
 <p> </p>
</div>
<div class="bar2">
 <p> </p>
</div>
<div class="back">
 <p> </p>
</div>

<div class="navbar">
<a class="link1" href="#1"></a>
<a class="link2" href="#2"></a>
<a class="link3" href="#3"></a>
<a class="link4" href="#4"></a>
</div></div>



<div id="1" class="slide">
<div class="textbox">
<br><center>
<table class="statistics">
<tr><td><b>Name:</b></td> <td><font style="float:right">
Diego Luna.</font></td></tr>
<tr><td><b>Nicknames:</b></td> <td><font style="float:right">
N/A.</font></td></tr>
<tr><td><b>Age:</b></td> <td><font style="float:right">
Twenty-three.</font></td></tr>
<tr><td><b>Birth Place:</b></td> <td><font style="float:right">
Rio de Janeiro, Brazil.</font></td></tr>
<tr><td><b>Occupation:</b></td> <td><font style="float:right">
Lion at the Sinner's Brothel.</font></td></tr>
<tr><td><b>Sexuality:</b></td> <td><font style="float:right">
Bisexual.</font></td></tr>
<tr><td><b>Marital Status:</b></td> <td><font style="float:right">
Single.</font></td></tr>
<tr><td><b>Positive Trait:</b></td> <td><font style="float:right">
Laid Back, Affectionate, Creative.</font></td></tr>
<tr><td><b>Negative Trait:</b></td> <td><font style="float:right">
Greedy, Commitment Issues.</font></td></tr>



</table>

</div></div>

<div id="2" class="slide">
<div class="textbox">
<br><center>
<li>Clean or smut, it's whatever.<br><br>
<hr>
<li>DM friendly, room mostly.<br><br>
<hr>
<li>Modern preferred, muse is fickle.<br><br>
<hr>
<li>Code is borrowed from <a target="_blank" href="https://roleplay.chat/profile.php?user=Petrone" target="_blank">Madame</a>. Don't steal. <br><br>
<hr>
<li> I guess you can have this <a target="_blank" href="https://imgur.com/a/fLHKCGT" target="_blank">gallery</a>. <br><br></center>

</div></div>

<div id="3" class="slide">
<div class="textbox">
<br><a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>

<a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>

<a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>

<a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>
<a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>

<a target="_blank" href="FRIEND PROFILE LINK HERE" title="WORDS ABOUT YOUR FRIEND HERE">
<img style="background: url('50x50 AVATAR OF YOUR FRIEND HERE') no-repeat; background-size: 50px; border: 1px solid #5E3929; height:50px; width:50px;"></a>
</div></div>

<div id="4" class="slide">
</div>

<div id="title">Yeah, you're sick of all those other imitators</div>
<div id="title2">Don't let the only real one intimidate you</div>