About me parts code :DDDDD

<style>

.logo {

content:url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Ftse4.mm.bing.net%2Fth%2Fid%2FOIP.0RdWU1LdK4Fu_l-37gLntgAAAA%3Fcb%3D12%26pid%3DApi&f=1&ipt=ba72b71df13dc439f72eff01af97321fd5a8be85ea20eb9701745363610e3251");

}

</style>

<style>

/* banner */

main:before {

width: 100%;

height: 170px;

display: block;

content: "";

background-image: url('https://media1.tenor.com/m/Uu3s7nWX-tgAAAAd/jumpstyle.gif');

background-position: center center;

background-size: cover;

}

@media only screen and (max-width: 600px) {

main:before{

height: 200px;</style>

<style>

body{

background-image: url(https://i.pinimg.com/originals/2d/09/f2/2d09f2844398497960c8a39c0693b16c.gif);

background-repeat: no-repeat;

background-attachment: fixed;

background-size: cover;

}

main {

       background-color: rgba(0, 0, 0, 0.7);

}

/* colors for the table headings on the left */

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {

     background-image: linear-gradient(darkgreen, greenyellow);

     color: black;

}

/* edit profile / user is your friend */

.profile-info {

    background-color: #ff0099;

    background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0, );

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

}

/* colors for table cell background (by default spacehey has a separate color for :first-child) */

.profile .table-section .details-table td {

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

     border: 2px solid darkgrey;

     border-radius: 3px;

     color: black;

}

/* friends comments - friend's name */

.comments-table td:first-child{

    background-image: linear-gradient(greenyellow, darkgreen)

}

/*friends comments- comment */

.comments-table td {

    background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

}

table.comments-table {

   border: 3px solid black;

   border-radius: 6px;

}

/* interests and links */

.profile .table-section {

    background-color: rgba(0, 0, 0, 0.7);

    color: white;

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

}

/* headings on the right */

.profile .blurbs .heading, .profile .friends .heading {

     background-image: linear-gradient(darkgreen, greenyellow);

     color: black;

}

/* mood and view my */

.profile .mood{

    padding-top: 5px;

    padding-left: 5px;

    box-shadow: 0px 0px 14px black;

    background-color: #ff0099;

    background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

     border-radius: 6px;

     border-style: outset;

     border-width: 1px;

     border: 3.5px solid rgba(0, 0, 0);

     margin-bottom: 20px;

    box-shadow: 0px 0px 14px black;

}

/* blog entries */

.blog-preview{

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

    padding: 8px;

}

nav .links {

     background-image: linear-gradient(darkgreen, greenyellow);

     color: black;

     border: 3px solid rgba(0, 0, 0);

     border-radius: 8px;

     box-shadow: 0px 0px 14px black;      

}

nav .top {

     background-image: linear-gradient(darkgreen, greenyellow);

     color: black;

     border: 3px solid rgba(0, 0, 0);

     border-radius: 8px;

     box-shadow: 0px 0px 14px black;      

}

footer {

     background-image: linear-gradient(darkgreen, greenyellow);

     color: black;

    border: 3px solid rgba(0, 0, 0);

    border-radius: 8px;

    box-shadow: 0px 0px 14px black;

}

.blurbs {

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

}

.profile .contact {

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

}

.profile .friends {

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

    margin-bottom: 10px

}

/* profile pic, details, etc box*/

.general-about {

    padding: 10px 10px 14px 10px;

    display: flex;

    height: 400px;

    padding: 10px 10px 14px 10px;

    display: flex;

    height: 180px;

    color: black;

     background-color: #ff0099;

     background-image: linear-gradient(ghostwhite, gainsboro, gainsboro, gainsboro);

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

    margin-bottom: 10px;

    margin-top: 0px;

}

span[itemprop="name"] h1 {

    background-image: linear-gradient(darkgreen, greenyellow);

    color: black;

    border: 3.5px solid rgba(0, 0, 0);

    border-radius: 6px;

    box-shadow: 0px 0px 14px black;

    margin: 0px 0px 0px 0px;

    padding: 2px;

}

:root {

    --light-gray: #f2f0f0;

    --gray: #e3e3e3;

    --dark-gray: #919191;

    --darker-gray: #545454;

    --logo-blue: #1D4ED8;

    --darker-blue: forestgreen;

    --lighter-blue: #60A5FA;

    --even-lighter-blue: #BFDBFE;

    --lightest-blue: #DBEAFE;

    --red: #FF0000;

    --dark-orange: darkgreen;

    --light-orange: darkgreen;

    --even-lighter-orange:  darkseagreen;

    --strange-yellow: #dbae2e;

    --green: #34D399;

    --light-green: #E6F8DD;

    --medium-green: #A0C99C;

    --dark-green: #059669;

    accent-color: #1D4ED8;

    accent-color: var(--logo-blue);

}

profile .blurbs .section h4 {

    color: black !important;

}

/* friend names */

.profile .friends .person p {

    color: darkgreen;

    text-decoration: underline;

}

/* friend count colour*/

.count {

   color: darkgreen;

   text-decoration: underline;

}

/* hide spacehey url */

.profile .url-info {

    display: none;

}

.online {

    margin:auto;

    padding-bottom: 5px;

    content: url(https://i8.glitter-graphics.org/pub/623/623338x25ne2bc99.gif);

}

</style>

<style>

.contact .inner a img {

  font-size: 0;

}

.contact .inner a img:before {

  font-size: 1em;

  display: block

}

.contact .inner a:before {

  content: ""

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {

  /* add to friends */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {

  /* add to favorites */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {

  /* send Message */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {

  /* forward to friend */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {

  /* instant message */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {

  /* block user */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {

  /* add to group */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {

  /* report user */

  display: inline-block;

  background: url("https://i.pinimg.com/originals/c1/b6/94/c1b694026e97030af44e136b8d83868d.png")no-repeat 0 0;

  background-size: 100%;

  width: 16px;

  height: 16px;

}

</style>

<!----- VINYL VINYL VINYL VINYL ---->

<style>

#vinyl-gallery * {

    all: unset;

  }

  #vinyl-gallery {

    all: initial!important;

    width: 100%!important;

    height: 230px!important;

    margin: 30px 0!important;

    display: flex!important;

    flex-direction: row!important;

    position: relative!important;

    margin-left: -6px!important;

  }

  #vinyl-gallery .vinyl {

      all:unset!important;

    perspective: 500px !important;

    width: 18px!important;

    transition: width 0.5s!important;

  }

  #vinyl-gallery .vinyl:hover {

    width: 148px!important;

  }

  #vinyl-gallery img {

      all:unset!important;

    transition: transform 0.5s, width 0.5s, height 0.5s, margin-top 0.5s!important;

    width: 180px!important;

    height: 180px!important;

    transform: rotateX(0deg) rotateY(25deg)!important;

    transform-style: preserve-3d!important;

    border-radius: 4px!important;

    border: 2px solid rgba(0, 0, 0, 0.1)!important;

object-fit: cover!important;

  }

  #vinyl-gallery .vinyl:hover img {

    transform: rotateX(0deg) rotateY(10deg)!important;

    width: 188px!important;

    height: 188px!important;

    margin-top: -2px!important;

  }

  #vinyl-gallery .title {

    color: #000000;

    display: block;

    visibility: hidden;

    position: absolute;

    bottom: 0px;

    text-align: center;

    width: 100%;

    padding-left: 6px;

  }

  #vinyl-gallery .vinyl:nth-child(n):hover + .title {

    visibility: visible;

  }

</style>

<div id="vinyl-gallery">

  <div class="vinyl">

    <img src="https://t2.genius.com/unsafe/387x387/https%3A%2F%2Fimages.genius.com%2F52328d54c327a70eb6543743112c277e.1000x1000x1.jpg"/>

  </div>

  <div class="title">ilyhiryu - ​vexzile 1.5_01</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/736x/b2/5c/f9/b25cf92024fc246a985b3729d355b7f6.jpg"/>

  </div>

  <div class="title">Snow strippers - under your spell</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/736x/ec/07/eb/ec07eb0d1cbdd37e70e657f66031a715.jpg"/>

  </div>

  <div class="title">luvwillow - edgy</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/1200x/79/12/56/79125603f661768cdf59d2ef88879a03.jpg"/>

  </div>

  <div class="title">pathetic - Dancing Nihilist</div>

  <div class="vinyl">

    <img src="https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fcoverartarchive.org%2Frelease%2Fe82e85e5-e341-4f7f-8e7b-2dbc42b25c32%2F28873980119.jpg&f=1&nofb=1&ipt=721a58803ffc56d41ffefbb7f80f0e9722457ad99dfad4180a2c484d65bcf5f0"/>

  </div>

  <div class="title">yabujin - 302? ionwan2go</div>

  <div class="vinyl">

    <img src="https://t2.genius.com/unsafe/387x387/https%3A%2F%2Fimages.genius.com%2Fe10c47178e604726a7ce96bff3ecad1a.500x500x1.jpg"/>

  </div>

  <div class="title">ilyhiryu - дай мені знати :(</div>

  <div class="vinyl">

    <img src="https://t2.genius.com/unsafe/387x387/https%3A%2F%2Fimages.genius.com%2Fc756805abddfa4a6e05b5328f38ee720.1000x1000x1.jpg"/>

  </div>

  <div class="title">ilyhiryu - JUMPSTYLE BOOTLEG</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/736x/6a/d3/5c/6ad35c475a779321c0709bb369c69ee5.jpg"/>

  </div>

  <div class="title">Slipknot - All Hope Is Gone</div>

  <div class="vinyl">

    <img src="https://t2.genius.com/unsafe/387x387/https%3A%2F%2Fimages.genius.com%2F608e69bac73c5167bc39034bc89ffe8b.1000x1000x1.png"/>

  </div>

  <div class="title">yabujin - NORTH KOREAN NARCOS</div>

  <div class="vinyl">

    <img src="https://t2.genius.com/unsafe/387x387/https%3A%2F%2Fimages.genius.com%2F1152759cc94bb53c39daae9a71b6cf29.500x500x1.webp"/>

  </div>

  <div class="title">yabujin - AVE XP</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/736x/3f/b2/5f/3fb25f78c242b348b46cfb6295d1d0ed.jpg"/>

  </div>

  <div class="title">caramella girls - caramella dance</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/1200x/f7/d2/50/f7d250235cf57dbd5268fe13fa385e77.jpg"/>

  </div>

  <div class="title">type o negative - world coming down</div>

  <div class="vinyl">

    <img src="https://i.pinimg.com/736x/b3/a5/a8/b3a5a8ebdb0b97cb84dff98950d92a8d.jpg"/>

  </div>

  <div class="title">limpbizkit - significant other</div>

  <div class="vinyl">

    <img src="https://i.discogs.com/v-VQg-pv9xE6TGLmrRr5SxxSQ0Fgx9KZZvDYinzTEtw/rs:fit/g:sm/q:90/h:600/w:600/czM6Ly9kaXNjb2dz/LWRhdGFiYXNlLWlt/YWdlcy9SLTI3ODQ2/LTEyNTcwMzIwNTcu/anBlZw.jpeg"/>

  </div>

  <div class="title">U 96 - Club Bizarre</div>

  <div class="vinyl">

    <img src="https://gcdn.thunderstore.io/live/repository/icons/Mozkey1-Caipirinha_IOSYS_Remix-1.1.0.png.128x128_q95.jpg"/>

  </div>

  <div class="title">IOSYS - Caipirinha</div>

</div>

<div style="float: ; width: 200px; height: 350px; position: absolute; right: 0px; margin: 20px; top: 10px; z-index: 200;">

<img src="https://i.pinimg.com/1200x/94/26/78/9426784eb3002e553c0408fc658b17c7.jpg"/>

</div>

<div style="float: ; width: 200px; height: 300px; position: absolute; left: 0px; margin: 15px; top: 700px; z-index: 200;">

<img src="https://i.pinimg.com/736x/91/1b/67/911b67c6d8652bb3225d2763361276cd.jpg"/>

</div>

<div style="float: ; width: 200px; height: 350px; position: absolute; right: 0px; margin: 20px; top: 1400px; z-index: 200;">

<img src="https://i.pinimg.com/736x/28/70/4f/28704f9ceaa41bd3d7118d593dd4ed96.jpg"/>

</div>