<style>
.pfor{display:none;}
body {background-color: #000000;}
body {background-image:url("https://images6.alphacoders.com/341/341165.jpg"); background-attachment:fixed; background-size:100%;}
#pbox {margin: auto;
width: 600px;
background-color:black;
border-style: solid;
border-width: 2px;
border-color: #333;
padding: 5px;
}
</style>

<style type="text/css">
!-- Copy from here, into the Style section --!
#player{
 position: fixed;
 z-index:2;
 bottom: 230px;
 left: 934px;
 border-radius: 15px;
 width: 32px;
 height: 32px;
 border: 5px solid #D5D5D5;
 box-shadow: 0px 0px 19px #D5D5D5;
 overflow:hidden;}


</style>



<style>
ul {
 list-style-type: none;
 margin: 0;
 padding: 0;
 overflow: hidden;
 background-color: #79B05E;
}

li {
 float: left;
}

li a {
 display: block;
 color: #86FEFF;
 text-align: center;
 padding: 14px 16px;
 text-decoration: none;
}

li a:hover {
 background-color: #527B3E;
}
</style>



<ul>
 <li><a href="#one">Stats</a></li>
 <li><a href="#two">Personality</a></li>
 <li><a href="#three">History</a></li>
 <li><a href="#four">OOC</a></li>

 <li><a href="#home">Reset</a></li>
</ul>






<style>
img {
 border-radius: 50%;
}

img {
 display: block;
 margin: auto;
 font-size: 18px;
}


.tabs {
float: left;
margin-right: 15px;
margin-bottom: 15px;
width: 54px;
height: 54px;
text-align: left;
}

.info{
position: fixed;
right: 550;
bottom: 50;
margin-top: 234px;
width: 326px;
height: 425px;
padding: 10px;
background: #79B05E;
font-family: Arial Italic;
color: #86FEFF;
font-size: 14px;
line-height: 15px;
text-align: justify;
border: 2px solid #86FEFF;
outline-offset: 2px;
opacity: 0;
overflow: auto;
transition: 1s;
}

.info:target{
opacity: 1;
transition: 1s;
z-index: 1;
}


</style>


<div class="info" id="one"><h1>Stats</h1>
<strong>Full Name:</strong> Sorren <br><br>
<strong>Age:</strong> 26 <br><br>
<strong>Gender:</strong> Genderless<br><br>
<strong>Race:</strong> Fey <br><br>
<strong>Height:</strong> 6'0" <br><br>
<strong>Alias:</strong> None <br><br>
<strong>Build:</strong> Flowy yet Flexing <br><br>
<strong>Sexual Orientation:</strong> Pansexual <br><br>
<strong>Status:</strong> Single <br> <br>
<strong>Occupation:</strong> Various Skills/Adventurer </div>

<div class="info" id="two"><h1>Personality</h1>Always looking at the world as if for the first time. Smelling the flowers and tasting the air. Fierce loyalty. Searching for the New. Finding it. Callous innocence. Flame and Thorn and Flower.</div>

<div class="info" id="three"><h1>History</h1>kinda depends on how i'm feeling honestly i like to change up the context based on what i'm feeling with a set character but i do love developing timelines</div>

<div class="info" id="four"><h1>OOC</h1><strong>PM Friendly<br><br>RP Friendly<br><br>Feel free to start with a post or discuss.</div>


<br>





<style>
img {
 border-radius: 50%;
 display: block;
 margin: auto;
 height:60%;
 width: auto;
}
</style>