ᴀғᴛᴇʀ ᴀʟʟ ᴛʜɪs ᴛɪᴍᴇ? ᴀʟᴡᴀʏs.

<style>
@import url('https://fonts.googleapis.com/css2?family=Jersey+15&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');


body {
background: #000;
}

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

::selection {
background: ;
color: white;
}

a {
text-decoration: none;
color: #C2A490;
}

a:hover {
color: #6D5952;
}

b {
color: #B1BDC6;
font-weight: bold;
}

i {
color: #C29F67;
font-style: italic;
}

.wilder {
position: absolute;
bottom: 0px;
right: 10px;
}

.container {
position: fixed;
height: 650px;
width: 750px;
background: #000;
top: 50px;
left: 50px;
}

.img {
position: absolute;
height: 600px;
width: 375px;
top: 25px;
left: 25px;
background: url(https://placehold.co/375x600.png);
background-size: 100%;
border: 1px solid #647C8E;
box-shadow: #647C8E 0px 0px 20px;
}

.stats {
position: absolute;
height: 250px;
width: 300px;
background: #000;
top: 25px;
right: 25px;
overflow: auto;
}

.stats h1 {
text-align: center;
font: 20px 'libre baskerville';
padding: 5px;
padding-right: 15px;
border-radius: 5px;
color: #647C8E;
font-weight: bold;
letter-spacing: 0px;
margin-top: 0;
}

.stats li {
display: block;
background: #000;
padding: 5px;
margin: 5px;
font: 12px 'libre baskerville';
text-align: justify;
color: #647C8E;
font-weight: ;
}

.hc {
position: absolute;
height: 265px;
width: 300px;
background: #000;
bottom: 100px;
right: 25px;
overflow: auto;
}

.hc h1 {
text-align: center;
font: 20px 'libre baskerville';
padding: 5px;
padding-right: 15px;
border-radius: 5px;
color: #647C8E;
font-weight: bold;
letter-spacing: 0px;
margin-top: 0;
}

.hc li {
display: block;
background: #000;
padding: 5px;
margin: 5px;
font: 12px 'libre baskerville';
text-align: justify;
color: #647C8E;
font-weight: ;
}

.cons {
position: absolute;
height: 55px;
width: 300px;
background: #000;
bottom: 35px;
right: 25px;
overflow: auto;
}

.contact {
width: 35px;
height: 35px;
border: 1px solid #647C8E;
display: inline-block;
transition: all 500ms linear;
object-fit: cover;
margin: 5px;
margin-bottom: 8px;
padding:4px;
background: transparent;
overflow:; }

.contact img {
width: 35px;
height: 35px;
transition: all 500ms linear;
-webkit-filter: grayscale(100%);
/* Safari 6.0 - 9.0 */
filter: grayscale(100%);
opacity: 1; }


</style>

<!--
 MUSIC PLAYER #02 by glenthemes
 ♬ glenthpvs.tumblr.com/player02
--->
<script src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script>
<link href="//fonts.googleapis.com/css?family=Readex+Pro" rel="stylesheet">
<link href="//glenthemes.github.io/-music-/glenplayer02.css" rel="stylesheet">
<script src="//glenthemes.github.io/-music-/glenplayer02.js"></script>
<style element="glenplayer02">
:root {
 --MusicPlayer-Position:bottom left;
 --MusicPlayer-Edge-Offset:18px;

 --MusicPlayer-Buttons-Size:14px;
 --MusicPlayer-Buttons-Color:#647C8E;
 --MusicPlayer-Buttons-Fill:yes;

}
</style>

<div glenplayer02>
 <div controls></div>

 <i class="aa-line-icons" icon-name="music-2"></i>

 <!-- HOW TO CHANGE THE MUSIC -->
 <!-- linktr.ee/direct_file_links -->
 <audio src="MUSIC_LINK" volume="100%"></audio>

</div>
<!--don't delete this line-->
<!--end music player-->

<div class="wilder"><a target="_blank" href="https://pastebin.com/u/wilderanima" title="code by wilder."><img src="https://i.imgur.com/hCJmFVu.png" width="75px;"></a></div>

<div class="container">
<div class="img"></div>

<div class="stats">
<h1>DOSSIER</h1>

<li>It scrolls! Add as many as you'd like.</li>
<li>words</li>
<li>words</li>
<li>words</li>
<li>words</li>
<li>words</li>
<li>words</li>
<li>words</li>
</div>

<div class="hc">
<h1>HEADCANONS</h1>

<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</li>
<li>It scrolls! Add as many as you'd like.</li>
<li>words</li>
<li>words</li>
<li>words</li>
<li><b>bold</b> <i>italic</i> <u>underline</u> <a target="_blank" href="LINK">link</a></li>
</div>

<div class="cons">

<!-- it scrolls, add as many as you'd like! -->

<a target="_blank" href="LINK" title="Name." >
 <div class="contact">
<img class="contact-img" src="https://placehold.co/50x50.png">
 </div> </a>

<a target="_blank" href="LINK" title="Name." >
 <div class="contact">
<img class="contact-img" src="https://placehold.co/50x50.png">
 </div> </a>
</div>

</div>