ɪ'ᴍ ᴅᴏɪɴɢ ᴍʏ ʙᴇsᴛ.

<style>

 @import url('https://fonts.googleapis.com/css2?family=Economica&display=swap');

 @font-face {font-family:'new'; src:url(https://dl.dropbox.com/s/qh3eg64wb150sho/TheRacoonQuestDemo-Regular.otf?dl=0);}

body {cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_1280.png), auto;
background-color: #000000; background-image: url("https://www.transparenttextures.com/patterns/black-twill.png");}

::-webkit-scrollbar {display: none;}

.wilder {
position: fixed;
bottom: 0px;
right: 0px;}

.container {
 position: absolute;
 margin: auto;
 top: 0px;
 bottom: 0px;
 left: 0px;
 right: 0px;
 height: 400px;
 width: 1005px;
 background-color: #999999;}

.image1 {
 position: absolute;
 margin: auto;
 top: 5px;
 left: 5px;
 background: url(https://placehold.co/245x135/000000/999999.png); /* top left */
 background-size: cover;
 background-position:;
 height: 135px;
 width: 245px;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);}

.image2 {
 position: absolute;
 margin: auto;
 bottom: 5px;
 left: 255px;
 background: url(https://placehold.co/245x135/000000/999999.png); /* bottom left */
 background-size: cover;
 background-position:;
 height: 135px;
 width: 245px;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);}

.image3 {
 position: absolute;
 margin: auto;
 top: 5px;
 left: 505px;
 background: url(https://placehold.co/245x135/000000/999999.png); /* top right */
 background-size: cover;
 background-position:;
 height: 135px;
 width: 245px;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);}

.image4 {
 position: absolute;
 margin: auto;
 bottom: 5px;
 left: 755px;
 background: url(https://placehold.co/245x135/000000/999999.png); /* bottom right */
 background-size: cover;
 background-position:;
 height: 135px;
 width: 245px;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);}

.title1 {
 position: absolute;
 margin: auto;
 top: -65px;
 left: 25px;
 right: 0px;
 font-family: new;
 font-size: 65px;
 letter-spacing: -2px;
 text-transform: uppercase;
 color: #999999;
 filter:drop-shadow(0px 0px 2px #999999);
 opacity: 1;
 z-index: 9999999;}

.words1 {
 position: absolute;
 top: 145px;
 left: 5px;
 height: 240px;
 width: 235px;
 padding: 5px;
 text-align: left;
 font-family: economica;
 font-size: 13px;
 overflow: auto;
 color: #FEFEFE;
 background-color: #000;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);
 z-index: 999;}

.put {
 position: absolute;
 top: 0px;
 left: auto;
 margin: auto;
 overflow: auto;
 overflow-x: hidden;
 opacity: 1;
 height: auto;
 width: 235px;
 padding: 0px;
 font-size: 1px;
 z-index: 999;}

 p.td {text-align: right; font-family:economica; margin-left: 50px; font-size: 13px; line-height: 15px; color: #FEFEFE; }

td {
 text-align: left;
 line-height: 20px;}

.words2 {
 position: absolute;
 bottom: 145px;
 left: 255px;
 height: 240px;
 width: 235px;
 padding: 5px;
 text-align: left;
 font-family: economica;
 font-size: 13px;
 overflow: auto;
 color: #FEFEFE;
 background-color: #000;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);
 z-index: 999;}

.words3 {
 position: absolute;
 top: 145px;
 left: 505px;
 height: 240px;
 width: 235px;
 padding: 5px;
 text-align: left;
 font-family: economica;
 font-size: 13px;
 overflow: auto;
 color: #FEFEFE;
 background-color: #000;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);
 z-index: 999;}

.words4 {
 position: absolute;
 bottom: 145px;
 left: 755px;
 height: 240px;
 width: 235px;
 padding: 5px;
 text-align: left;
 font-family: economica;
 font-size: 13px;
 overflow: auto;
 color: #FEFEFE;
 background-color: #000;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 3px #000);
 z-index: 999;}

 b { letter-spacing: 0px; font-family: economica; color: #999999; font-weight: bold; font-size:14px; text-transform: uppercase; filter:drop-shadow(0px 0px 2px #999999);}

 strong { letter-spacing: 1px; font-family: economica; color: #777777; font-weight: bold; font-size:14px; text-transform:; filter:drop-shadow(0px 0px 1px #777777);}

 u { letter-spacing: 1px; font-family: economica; color: #555555; font-weight: bold; font-size:13px; text-transform:; filter:drop-shadow(0px 0px 1px #555555);}

 s { letter-spacing: 1px; font-family: economica; color: #333333; font-weight: bold; font-size:13px; text-transform:; filter:drop-shadow(0px 0px 1px #333333);}

 a { font-family: economica; letter-spacing: 0px; color: #FEFEFE; font-size: 14px; font-weight: bold; text-decoration: none; text-transform: uppercase; transition: 0.7s;
 cursor: url(https://i.imgur.com/WIeMSiR.png), auto; filter:drop-shadow(0px 0px 1px #FEFEFE);}

 a:hover { font-family: economica; letter-spacing: 0px; color: #999999; font-size: 14px; font-weight: bold; text-decoration: none; text-transform: uppercase; transition:0.7s;
 cursor: url(https://i.imgur.com/WIeMSiR.png), auto; filter:drop-shadow(0px 0px 1px #999999);}

.contacts {
 position: absolute;
 top: -40px;
 right: 0px;
 height: 30px;
 width: 500px;
 padding: 5px;
 text-align: right;
 font-family: economica;
 font-size: 13px;
 overflow: auto;
 color: #FEFEFE;
 background-color: transparent;
 border-outline: 1px solid #000;
 filter:drop-shadow(0px 0px 0px #555555);
 z-index: 9999999999999999999999999;}

.fr1 {width: 30px; height: 30px; margin-bottom: 0px; margin-top: 0px; margin-right: 10px; margin-left: 0px; border: 0px solid #000; border-radius: 5px; z-index: 999;}

</style>

/* don't remove this */
<div class="wilder">
<a target="_blank" href="https://roleplay.chat/profile.php?user=WILDER" title="ᴄᴏᴅᴇ ʙʏ ᴡɪʟᴅᴇʀ"><img src="https://i.imgur.com/hCJmFVu.png" width="75px;"></a>
</div>

<div class="container">

<div class="image1"></div>
<div class="image2"></div>
<div class="image3"></div>
<div class="image4"></div>

<div class="title1">Title Here</div>

<div class="words1">
<div id="01" class="put">

<table border="0" cellspacing="-10">

<tr>
<td><b>Name</b></td>
<td>
<p class="td">Name</p>
</td>
</tr>

<tr>
<td><b>Nicknames</b></td>
<td>
<p class="td">Nicknames</p>
</td>
</tr>

<tr>
<td><b>Socials</b></td>
<td>
<p class="td"><a title="Details.">@socials</a></p>
</td>
</tr>

<tr>
<td><b>Birthdate</b></td>
<td>
<p class="td">Birthday <b>/</b> Age</p>
</td>
</tr>

<tr>
<td><b>Birth Place</b></td>
<td>
<p class="td">Birth Place</p>
</td>
</tr><br>

<tr>
<td><b>Residence</b></td>
<td>
<p class="td">Residence</p>
</td>
</tr>

<tr>
<td><b>Orientation</b></td>
<td>
<p class="td">Sexuality</p>
</td>
</tr>

<tr>
<td><b>Marital</b></td>
<td>
<p class="td"><a target="_blank" href="https://roleplay.chat/profile.php?user=" title="Details.">Marital</a></p>
</td>
</tr>

<tr>
<td><b>Alumni</b></td>
<td>
<p class="td">House <b>/</b> Year</p>
</td>
</tr>

<tr>
<td><b>Wand</b></td>
<td>
<p class="td">Length, Wood, Core, Flexibility</p>
</td>
</tr>

<tr>
<td><b>Patronus</b></td>
<td>
<p class="td"><a target="_blank" title="Details.">Patronus</a></p>
</td>
</tr>

<tr>
<td><b>Boggart</b></td>
<td>
<p class="td">Boggart</p>
</td>
</tr>

<tr>
<td><b>Amortentia</b></td>
<td>
<p class="td">Amortentia</p>
</td>
</tr>

<tr>
<td><b>Blood</b></td>
<td>
<p class="td">Blood Status</p>
</td>
</tr>

<tr>
<td><b>Ethnicity</b></td>
<td>
<p class="td">Ethnicity</p>
</td>
</tr>

<tr>
<td><b>Hair</b></td>
<td>
<p class="td">Hair Color</p>
</td>
</tr>

<tr>
<td><b>Eyes</b></td>
<td>
<p class="td">Eye Color</p>
</td>
</tr>

<tr>
<td><b>Height</b></td>
<td>
<p class="td">0'0" <b>/</b> 000cm</p>
</td>
</tr>

<tr>
<td><b>Weight</b></td>
<td>
<p class="td">000lbs <b>/</b> 00kg</p>
</td>
</tr>

<tr>
<td><b>Physique</b></td>
<td>
<p class="td">Physique</p>
</td>
</tr>

<tr>
<td><b>Notable</b></td>
<td>
<p class="td"><a target="_blank" title="Details.">Scars</a> <b>/</b> <a target="_blank" title="Details.">Tattoos</a></p>
</td>
</tr>

<tr>
<td><b>Scent</b></td>
<td>
<p class="td"><a target="_blank" title="Details.">Scent</a></p>
</td>
</tr>

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

<div class="words2">

<center><strong>“ Add a quote, or remove this. <br>I don't care either way. ”</strong></center> <br>

<b>Core Subjects</b> <br>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. <br><br>

<b>Electives</b> <br>
Nostra nisl feugiat donec sodales viverra cursus ipsum. <br><br>

<b>Extracurriculars</b> <br>
Mi lobortis semper feugiat sodales a porttitor conubia <br><br>

<b>Grade Average</b> <br>
<strong>---.</strong> <br><br>

Ultrices fringilla convallis litora cras quis metus a rutrum. Ultrices egestas vehicula sed eu ac cursus orci enim. <br><br>

Ornare ornare habitasse urna eu curabitur nam accumsan. Dignissim faucibus nascetur magna rhoncus laoreet.

</div>

<div class="words3">

 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br><br>

 Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <br><br>

 Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. <br><br>

 Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

</div>

<div class="words4">

 Code by <a target="_blank" href="https://roleplay.chat/profile.php?user=WILDER">Wilder</a> — <strong>don't steal it!</strong> <br><br>

 OOC can go here! <br><br>

 OOC can go here! <br><br>

 OOC can go here! <br><br>

 OOC can go here! <br><br>

 <b>bold</b> <strong>strong</strong> <u>underline</u> <s>strike</s> <a>Link</a>

</div>

<div class="contacts">

 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>
 <a target="_blank" href="https://roleplay.chat/profile.php?user="><img src="https://placehold.co/50x50.png" style="filter:grayscale(100%) brightness(100%); opacity:1" class="fr1" title="Details."></a>

</div>

</div>

<!----- 【 MUSIC PLAYER #06 by @glenthemes 】 ----->
<link href="//glen-players.gitlab.io/06/setup.css" rel="stylesheet">
<script src="//glen-players.gitlab.io/06/init.js"></script>

<div glenplayer06>

    <!--- vinyl icon --->
    <i class="06i" icon-name="vinyl" aria-label="Vinyl icon"></i>

    <!--- player buttons --->
    <button play-button aria-label="Play"></button>
    <button pause-button aria-label="Pause"></button>

    <!--- song file URL --->
    <!--- PLEASE READ: linktr.ee/direct_file_links --->
    <audio src="MUSIC_LINK" volume="100%"></audio>

</div>

<style element="glenplayer06">
[glenplayer06]{
    /*--- options here ---*/
    --MusicPlayer-Position:"bottom left";
    --MusicPlayer-Corner-Offset:1rem;
    z-index:99; /* increase this number if you can't see or click your music player */

    --MusicPlayer-Vinyl-Size:1rem;
    --MusicPlayer-Vinyl-Color:#999;
    --MusicPlayer-Vinyl-Spin-Speed:3.5s;

    --MusicPlayer-Buttons-Size:1rem;
    --MusicPlayer-Buttons-Color:#999;
    --MusicPlayer-Buttons-Padding:6px;

    --MusicPlayer-Gap-1:9px;
    --MusicPlayer-Gap-2:9px;
}/* do not delete this bracket */
</style><!--don't delete this line-->
<!---- END MUSIC PLAYER ---->