Pasted

<style>
 
@import url('https://fonts.googleapis.com/css2?family=Caveat+Brush&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Short+Stack&display=swap');
 
body {
cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_1280.png), auto;
background-color: #000;
}
 
::-webkit-scrollbar {
display: none;
}
 
::selection {
background: ;
color: white;
}
 
a {
text-decoration: none;
color: #000;
}
 
a:hover {
color: #ADACC1;
}
 
b {
color: #B1BDC6;
font-weight: bold;
}
 
i {
color: #BE6C79;
}
 
.wilder {
position: absolute;
bottom: 0px;
right: 5px;
}
 
.container {
position: absolute;
margin: auto;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
height: 650px;
width: 800px;
background-color: #000;
}
 
.mainimg {
position: absolute;
height: 600px;
width: 375px;
top: 25px;
right: 25px;
background: url(https://placehold.co/375x600.png);
background-size: 100%;
border: 1px solid #7D86AD;
border-radius: 5px 20px 20px 5px;
box-shadow: #7D86AD 0px 0px 20px;
}
 
.name { 
position: relative;
font-family: 'anton'; 
font-size: 50px; 
font-style: italic;
margin-top: 5px; 
margin-bottom: 5px; 
left: 35px;
top: 445px;
text-shadow: 2px 2px 2px #7D86AD; 
color: #EEEDEE; 
letter-spacing: -1px;
z-index: 1;}
 
.stats {
position: absolute;
top: 25px;
left: 25px;
height: 230px;
width: 350px;
background: #7D86AD; 
border: 1px solid #7D86AD;
border-radius: 20px 5px 5px 20px;
box-shadow: #7D86AD 0px 0px 20px;
padding: 10px;
overflow: auto;
}
 
.stats h1 {
text-align: right;
font: 20px anton;
padding: 0px;
padding-right: 50px;
border-radius: 5px;
color: #EEEDEE;
font-style: italic;
margin-top: 0;
}
 
.stats li {
display: block;
background: #575D79;
box-shadow: #EEEDEE 0px 0px 5px;
opacity: 0.8;
padding: 8px;
margin: 3px;
border-radius: 20px 5px 5px 5px;
font: 13px short stack;
text-align: right;
color: #F1DED6;
font-weight: bold;
}
 
.hc {
position: absolute;
top: 280px;
left: 25px;
height: 150px;
width: 350px;
background: #7D86AD; 
border: 1px solid #7D86AD;
border-radius: 20px 5px 5px 20px;
box-shadow: #7D86AD 0px 0px 20px;
padding: 10px;
overflow: auto;
}
 
.hc h1 {
text-align: right;
font: 20px anton;
padding: 0px;
padding-right: 50px;
border-radius: 5px;
color: #EEEDEE;
font-style: italic;
margin-top: 0;
}
 
.hc li {
display: block;
background: #575D79;
box-shadow: #EEEDEE 0px 0px 5px;
opacity: 0.8;
padding: 8px;
margin: 3px;
border-radius: 20px 5px 5px 5px;
font: 13px short stack;
text-align: right;
color: #F1DED6;
font-weight: bold;
}
 
.cons {
position: absolute;
top: 505px;
left: 25px;
height: 100px;
width: 350px;
background: #7D86AD; 
border: 1px solid #7D86AD;
border-radius: 20px 5px 5px 20px;
box-shadow: #7D86AD 0px 0px 20px;
padding: 10px;
overflow: auto;
}
 
.cons h1 {
text-align: right;
font: 20px anton;
padding: 0px;
padding-right: 50px;
border-radius: 5px;
color: #EEEDEE;
font-style: italic;
margin-top: 0;
}
 
.contact {
width: 35px; 
height: 35px; 
border: 1px solid #575D79; 
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:#7D86AD;
 --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="mainimg"></div>
<div class="name">NAME LASTNAME</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>
 
</div>
<div class="hc">
<h1>headcanons</h1>
<li><b>bold</b> <i>italic</i> <u>underline</u> <a>link</a></li>
<li>stat</li>
<li>stat</li>
<li>stat</li>
<li>stat</li>
<li>stat</li>
<li>stat</li>
</div>
<div class="cons">
<h1>connections</h1>
<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>
<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>
<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>