Profile HTML

<style>
.pfor{display:none;}
body {background-color: #ffffff;}
body {background-image:url("URL"); 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: rgba(0,0,0, 0.8);
}

li {
 float: left;
}

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

li a:hover {
 background-color: rgba(0,0,0, 0.8);
}
</style>



<ul>
 <li><a href="#one">Stats</a></li>

 <li><a href="#two">Personality</a></li>
 <li><a href="#five">Gallery</a></li>
 <li><a href="#four">OOC</a></li>

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






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

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: 300;
bottom: 150;
margin-top: 234px;
width: 326px;
height: 425px;
padding: 10px;
background: rgba(0,0,0, 0.8);
font-family: Arial Italic;
color: #ffffff;
font-size: 14px;
line-height: 15px;
text-align: justify;
border: 2px solid #ede9ef	;
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> - <br><br>
<strong>Age:</strong> - <br><br>
<strong>Gender:</strong> - <br><br>
<strong>Race:</strong> - <br><br>
<strong>Height:</strong> - <br><br>
<strong>Alias:</strong> - <br><br>
<strong>Build:</strong> - <br><br>
<strong>Sexual Orientation:</strong> - <br><br>
<strong>Occupation:</strong> - </div>

<div class="info" id="two"><h1>Personality</h1> </div>


<div class="info" id="four"><h1>OOC</h1><strong><br><br></strong></div>

<div class="info" id="five"><h1>Gallery</h1><style>

div.img {
 margin: 5px;
 border: 1px solid #ccc;
 float: left;
 width: 180px;
}

div.img:hover {
 border: px solid #777;
}

div.img img {
 width: 100%;
 height: 80%;
}

div.desc {
 padding: 15px;
 text-align: center;
}
</style>


<a target="_blank" href="GALLERYURL"><b>Gallery</b></a>

</div>
<br>
<div id="player">
<audio controls loop="1"><source src="URLMUSIC"></audio>
</div>
<style>
img {
 border-radius: 4%;
 display: block;
 margin: auto;
 height:80%;
 width: auto;
}
</style>
<br><br><br><br><br>

<img src="URL" width="400" height="300">